今回は、Figmaでシンプルなボタン・コンポーネントを作る方法を紹介します。テキストのシンプルなボタンを、「Component」と「Variants」と「Auto layout」を使って丁寧に作成します。また、自由に使えるサンプルファイルも用意していますので、よかったらご活用ください。 この記事のターゲットFigmaの中級者〜上級者 Figmaでボタン・コンポーネントの作り方が知りたい方 Figmaの Component と Variants と Auto layout の使い方が知りたい方 1. ボタンの Component をつくる今回は、背景・枠線・テキストのみスタイルを設定した最もシンプルなボタンを作ってみようと思います。 まず、Textツールで適当なテキストを用意し、選択した状態で「Shift + Aキー」を押します。すると、テキストが「Frame」という Auto layout
![Figmaでシンプルなボタン・コンポーネントを作る方法 | wentz-design.com](https://cdn-ak-scissors.b.st-hatena.com/image/square/cdd228bca0cb9a26f0c3d6abb0490631fd372360/height=288;version=1;width=512/https%3A%2F%2Fimages.ctfassets.net%2Fubv4j9m3121x%2F3BvQy2UDmpnNDsS9ehyCRN%2F9af12c0212cc37d0aeb4f205eb388b6f%2Ffigma-how-to-create-button.png%3Fw%3D1200%26h%3D630%26q%3D50%26fm%3Dpng)