バリアブルをデザインに適用する

はじめに

この機能を使用できるユーザー

すべてのプランのすべてのユーザーがバリアブルを使用できます

ファイルへのアクセス権を持つどのユーザーも、そのファイルからバリアブルを使用できます

バリアブルは初めてですか? バリアブルのガイドを確認する→

レイヤープロパティにバリアブルを適用する

右サイドバーのさまざまなプロパティセクションを使用して、バリアブルをレイヤーに適用します。バリアブルは、そのバリアブルタイプのサポート対象に応じてさまざまなプロパティに適用できます。

ファイルのローカルバリアブルからのバリアブルでも、アクセス権を持つ任意の公開されたチームライブラリからのバリアブルでも使用できます。

色バリアブルを適用する

選択したオブジェクトに色バリアブルを適用するには、次の手順に従います。

1. 右サイドバーの[塗り]または[線]セクションで [スタイル]アイコンをクリックします。
2. スタイル選択機能からバリアブルを選択します。
   • 色バリアブルは四角で表示され、色スタイルは円で表示されます。
   • 検索バーを使用して名前でバリアブルを検索するか、ドロップダウンを開いてライブラリでフィルタリングします
   • スタイル選択機能はリストでもグリッドでも表示できます

選択したオブジェクトに複数の色バリアブルを適用するには、次の手順に従います。

1. [塗り]または[線]セクションからプラスアイコンをクリックして、別の塗りを追加します。
2. 塗りボックスを選択して、色選択機能を開きます。
3. [ライブラリ]タブを選択して、色バリアブルを選択します。

選択範囲内の色バリアブルを適用することもできます。

数字バリアブルを適用する

選択したオブジェクトに数字バリアブルを適用するには、次の手順に従います。

1. プロパティフィールドにカーソルを合わせ、次のいずれかの手順を行います。
   • それぞれの角の半径とすべてのプロパティの場合: フィールドをクリックして=を押します
   • 幅、高さ、最小および最大の幅/高さ、間隔の場合: ドロップダウンを開いて[バリアブルを適用]を選択します
   • パディングと均等な角の半径の場合: [バリアブルを適用]をクリックします
2. ライブラリ選択機能からバリアブルを選択します。 数字バリアブルは数字アイコンで記されています。

テキストレイヤーに数字または文字列バリアブルを適用する

選択したテキストレイヤーに文字列バリアブルを適用するには、次の手順に従います。

1. 右サイドバーの[テキスト]セクションから [バリアブルを適用]をクリックします。
2. 数字バリアブルまたは文字列バリアブルを選択します。

ブーリアンバリアブルを適用する

選択したオブジェクトにブーリアンバリアブルを適用するには、次の手順に従います。

1. 右サイドバーの[レイヤー]セクションから、表示 / 非表示アイコンを右クリックします。
2. 選択機能からバリアブルを選択します。ブーリアンバリアブルはトグルオンまたはトグルオフアイコンが記されています。

バリアントインスタンスにバリアブルを適用する

ブーリアン、数字、文字列の各バリアブルを、バリアントプロパティを持つインスタンスに適用できます。

バリアントインスタンスのバリアブルモードの作成方法についてはこちら→

バリアブルの適用を解除する

レイヤーに適用したバリアブルを解除するには、適用したバリアブルがあるレイヤーを選択して、次のいずれかの操作を行います。

• 色、文字列、ブーリアンの各バリアブルの場合、該当する右サイドバーセクションでバリアブルにカーソルを合わせて、 [バリアブルを切り離す]アイコンをクリックします
• 数字バリアブルの場合は、プロパティフィールドをクリックして、Delete / Backspaceを2回押します。