色、テキスト、エフェクト、レイアウトグリッドのスタイルの作成 – Figma Learn - ヘルプセンター

はじめに

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

すべてのプランの全員がスタイルを作成できます。エデュケーション、プロフェッショナル、ビジネス、エンタープライズの各プランの全員がスタイルを公開できます。

ファイルの編集可アクセス権があれば、誰でもスタイルを作成および編集できます。

公開済みファイルの閲覧のみアクセス権があるユーザーは、そのライブラリから取得したスタイルを、編集可能なファイルで使用できます。

スタイルによってオブジェクトのプロパティのセットを定義することができます。複数のデザイン間で再利用することができます。

次のスタイルを作成できます。

テキスト: フォントファミリー、サイズ、行間、間隔
- テキストスタイルは、レイヤーの全体またはテキストの一部に適用できます。ヘッダー、本文のテキスト、リンクされたテキストのような段落内のテキストのスタイルを定義するのに最適です。
- テキストの配置についてはテキストスタイルが作成できないため、各ブロックごとに個別に配置を設定する必要があります。
色: 塗り、線、画像、グラデーション
- グラデーションのスタイルを作成する場合は、使用される色とグラデーションの方向、すなわち角度の両方がスタイルに保存されます。

エフェクト: ドロップシャドウ、インナーシャドウ、レイヤーブラー、背景のぼかし範囲
- スタイルには1つ以上のエフェクトを含めることができ、適用されたプロパティはすべてスタイルに保存されます。
- シャドウスタイルは、右サイドバーの[エフェクト]セクションにアイコンで表示され、シャドウスタイルの方向に従って変化します。アイコンは、ドロップシャドウかインナーシャドウかによって変化し、x値、y値によっても変化します。
フレームのレイアウトグリッド: 行、列、グリッド
- これは、複数のデザイン間で、特定のフォーマットまたは構造を複製するのに便利です。
- グリッドスタイルは、右サイドバーの [レイアウトグリッド] セクションにアイコンで表示され、タイプ(グリッド、列または行)によって変化します。レイアウトグリッド作成の詳細情報→

ローカルスタイルからの作成

ローカルスタイルは、現在のファイルに存在しているスタイル定義です。ローカルスタイルには、何も選択せずに右サイドバーで、またはスタイル選択機能からアクセスできます。スタイルは次のタイプごとにグループ化されます。

新しいローカルスタイルを作成するには、次の手順に従います。

新しいスタイルを作成するオブジェクトまたはフレームを選択します。
右側のサイドバーで、作成するスタイルに対応するセクションの横にあるをクリックします。
スタイル選択機能のをクリックします。[新しいスタイルを作成]モーダルで[その他のオプションを表示]をクリックして、スタイルプロパティを表示したり編集したりします。
スタイルに名前と説明をつけて、[スタイルを作成]をクリックします。スタイル選択機能でこのスタイルにマウスカーソルを合わせると説明が表示されます。

ヒント! スタイルには、名前と説明の両方を付けることができます。名前と説明を利用して、ただ単に色の説明として使用するのではなく、スタイルがデザインの中でどのように使用されるのかを伝えることをお勧めします。

スタイルを簡単に見つけて選択できるように、スタイルをフォルダに整理しましょう。スタイルの命名、管理、共有の詳細情報→