figma アイコン付きボタンの作成
2025 年 7 月 31 日 木曜日 by marukorアイコン付きボタンコンポーネントの作成
アイコン付きボタンの、アイコンの部分を切り替えられる汎用的はボタンの作成方法を紹介します。
1.コンポーネントを作成する
まずはボタンコンポーネントの作成と、iconを複数用意します。

アイコン付きボタンの、アイコンの部分を切り替えられる汎用的はボタンの作成方法を紹介します。
まずはボタンコンポーネントの作成と、iconを複数用意します。
Figmaでは同じUIパーツを何度も作る手間を減らすために、コンポーネントが活躍します。
一度作ったパーツを再利用でき、変更も一括反映できるため、作業効率が上がります。
また、デザインの一貫性を保ちやすく、チームでの共同作業にも便利になります。
コンポーネントとは、Figmaで再利用できるデザインパーツのことです。
ボタンやカードなどを部品化することで、使い回しや一括管理ができるようになります。