CSS3によるカスタムスタイル

新しく追加されたCustom Styles（カスタムスタイル）により、デザイナーと開発者の間の距離はさらに小さくなりました。 CSS3コードを使用して、要素の外観と動作を直接設定できます。

要素を選択すると、プロパティパネルの最後にカスタムCSSセクションが表示されます。ここにCSSコードを入力するか、別のソースからコピーして貼り付けるとすぐにキャンバスで表示されます。

下の動画の例では、数回のクリックでボックスに影を追加します。

box-shadow: 0 10px 30px 0 rgba(0,0,0,0.2);

また、要素のすべてのビジュアル設定に一度で直接影響を与えることもできます。CSS3コード生成を使用しました：

ここでは、この例で使用したコードを紹介します:

width: 180px;
height: 60px;
border-radius: 30px;
color: rgba(0,0,0,1);
background: #ffffff;
box-shadow: 0 10px 30px 0 rgba(0,0,0,0.2);

すべてのCSSプロパティが対応されているわけではありませんが、以下では使用可能なプロパティの完全なリストをご紹介します。

Background のプロパティ:

'background'

'background-attachment'

'background-clip'

'background-color'

'background-image'

'background-origin'

'background-position'

'background-repeat'

'background-size'