カラーパレットを使って要素の背景、テキスト、アイコンなどの色を変更できます。

色を選ぶ 

色の選択方法が2つあります。

  1. カラーピッカーを使用する

カラープレーンのどこかをクリックし、水平方向のスライダーを使って色相を選択します。カラープレーンを移動して、水平軸、垂直軸を調整しながら彩度を設定します。

 2. 16進数コードまたはRGBAの値を入力して正確な色を選択する

スウォッチを保存する

スウォッチは、プロジェクト内で再び使用するために保存する色です。カラーパレットにスウォッチが保存されると、Webページ上のどの要素にも簡単に適用できます。

スウォッチを保存するには、16進数のカラーコードを入力するか、カラーピッカーで色を選択します。 次に、「+」をクリックすると、スウォッチが保存されます。

あらかじめ用意された色、グラデーションを使用する

カラーパネルの中段左端の、○4つのマークをクリックすると、既存のパレットを表示し使用することが可能です。中段中央の2種類のボタンは、単色 or グラデーションを選択できます。

透明度を設定する

カラーピッカーに表示された、水平方向のスライドバーを使用して色の透明度を設定できます。

16進数コードとRGBAコードについて

16進数コードとRGBAコードは、HTMLのカラーコードフォーマットです。

HTMLカラーコードは、Webで処理できるように表示する、色を表現するための方法です。

  • 16進数コードは最も使用され、#と6桁の数字で構成されています。
  • RGBAコードは3つの色相(赤Red、緑Green、青Blue)それぞれの値と透明度(A)で構成されています。

RGBAコードについての詳細は、こちらをご確認ください。

16進数コードとRGBAを切り替える

下記の通り、2つのカラーコードを簡単に切り替えることができます。

グラデーションを作成する

グラデーションは、互いの色が徐々に混ざり合っていく色の範囲です。こちらは一例です。

グラデーションを作成するには:

  1. カラーパレットからグラデーションのアイコンを選択します。

  2. 水平方向のスライダーのトグルをクリックして、グラデーションを構成する2色を選択します。

  3. グラデーションの濃さと角度を設定する

このようにグラデーションを設定します。

Did this answer your question?