2023年07月24日(月)
FigmaのVariableの使い方
Variableとは
Variableはスタイルのように再利用可能な定義で、色、数値、文字列などのさまざまなデザイン属性に割り当てることができます。
Variableのタイプ
Variableには、以下の4つのタイプがあります。
Color
- Color
- Number
- String
- Boolean
Colorは値に色を設定でき、オブジェクトの塗りやストロークに適用できます。
NumberNumberは値に数値を設定でき、幅や高さ、間隔、パディング、角丸などに適用できます。
StringStringは値に文字列を設定でき、テキストレイヤーに適用したり、バリアントに使うことができます。
BooleanBooleanは値にtrueまたはfalseを設定でき、レイヤーの表示非表示を切り替えるために使用できます。
Variableの作成
Variable作成の手順を案内します。
Variableモーダルを開く
キャンバス上で何も選択して...
0
61
2
4author:
Design Spice
フリーランスwebデザイナーのHiroさんが、習得した情報や学んだことのアウトプットとしてWeb制作に関する多彩な情報を発信しているblog
Ads
フリーランスwebデザイナーのHiroさんが、習得した情報や学んだことのアウトプットとしてWeb制作に関する多彩な情報を発信しているblogDesign Spiceの記事『FigmaのVariableの使い方』についてまとめています。
この記事は特にレスポンシブ・アニメーション・アイコン・Photoshop・facebookについて書かれており、 気になるWebデザインの記事やまとめを見つけたら「本文を読む」をクリックすると、記事配信元のDesign Spiceで全文を閲覧することができます。RSS Sourceの「このサイトの記事一覧」をクリックするとDesign Spiceの記事をまとめて表示することができます。また閲覧数や各SNSのシェア状況を目安に、他の人たちが記事をどのように評価しているのか推測することができます。Webデザインにとって有益な記事をまとめていますので、ぜひリンク先をチェックしてみてください。
