アイコンのスタイル設定

お知らせ：当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

1. 説明

アイコンピッカー（要素ページへのリンク）でアイコングリフを選択すると、［アイコン］プロパティでページ上の表示方法を設定できます。各サブプロパティでは、次の内容を設定します。

これら3つの設定を組み合わせることで、周囲のコンテンツに合わせてアイコンの太さや色調を調整できます。

。

［サイズ］ - ［サイズ］のドロップダウンから選択するpx単位の数値です。グリフの表示サイズを指定します。小さい値はインラインアイコンや補助ラベルに適しており、大きい値はヒーローアイコン、機能の強調表示、空の状態を示すイラストに適しています。

メモ：アイコンのサイズは8～72ピクセルの範囲で選択できます。

［スタイル］ - アイコングリフを［輪郭線］または［塗りつぶし］された形状のどちらで表示するかを設定します。

選択肢	説明
［輪郭線］	アイコンが線のみで描画され、グリフの内側は透明になります。適している用途：軽く洗練された印象にする場合に適しています。主に補助的な操作、ナビゲーションアイコン、情報を示すインジケーターに使用します。
［塗りつぶし］	アイコンが完全に塗りつぶされた形状で表示されます。適している用途：強く目立つ印象にする場合に適しています。主に主要な操作、アクティブな状態、はっきりと目立たせる必要があるアイコンに使用します。

［色］ -カラーピッカーから選択し、アイコングリフの線（輪郭線）と塗りつぶし（塗りつぶし）の両方に適用する色です。

選択肢	説明
［標準］	ドキュメントの色、標準色、またはモノクロ色から選択します。
［カスタム］	16進数またはRGBコードを直接入力して、色を正確に指定します。

編集スペースでアイコン要素を選択し、フローティングツールバーの［3点リーダー］をクリックして、右側に［プロパティ］ペインを開きます。
ペイン内の［アイコン］アコーディオンをクリックして開きます。
アイコンのサイズを設定します。
1. 左側の［サイズ］のドロップダウンをクリックし、8～72ピクセルの選択肢から目的のpx値を選択します。
アイコンのスタイルを設定します。
1. 右側の［スタイル］のドロップダウンをクリックし、［輪郭線］または［塗りつぶし］を選択します。
アイコンの色を設定します。
1. 下にある［色］の項目で［カラースウォッチ］をクリックし、カラーピッカーを開きます。
  1. ［標準］タブ：ドキュメントの色、標準色、またはモノクロ色から選択できます。
  2. ［カスタム］タブ：16進数またはRGBコードを直接入力できます。
変更内容を保存するには、右上の［保存］をクリックします。

［アイコン］のスタイルプロパティは、次の要素でのみ使用できます。