グラデーションを付ける

この記事では "背後の丸枠" のシェイプのフィルの色を "単色の水色" から "水色から緑色へのグラデーション" に変更します。

まずは "背後の丸枠" のシェイプを選択する必要があります

1. "背後の丸枠" のシェイプを選択する
1. "背後の丸枠" のシェイプを選択する

上図のように形状選択ツールで "背後の丸枠" のシェイプを選択します。 もちろん、レイヤ "背後の丸枠" を選択しておく必要があります

これでフィルの色を変更する準備ができました。 まずは "単色" から "グラデーション" に変更しましょう。

2. ツールのオプションパネルの "フィル" タブの[グラデーションで塗りつぶし]ボタンを押す
2. ツールのオプションパネルの "フィル" タブの[グラデーションで塗りつぶし]ボタンを押す

上図のようにツールのオプションパネルの "フィル" タブの[グラデーションで塗りつぶし]ボタンを押します。

3. 白色から灰色へのグラデーションで塗られる
3. 白色から灰色へのグラデーションで塗られる

上図のようにシェイプのフィルが白色から灰色へのグラデーションに変化します。 また、左上と右下にオレンジ色の菱形ハンドル()が出現しました。

オレンジ色の菱形ハンドル()がグラデーションの開始位置と終了位置です。 つまり、現状では左上から右下へグラデーションがかかっています。

  
オレンジ色の菱形ハンドル()はマウスの左ボタン(マウスの左ボタン)のドラッグで移動することができます。

続いて、グラデーションの開始色と終了色を設定します。 開始色を水色に終了色を緑色に設定しましょう。

4. ツールのオプションタブのグラデーションバーの左下のグラデーションストップをダブルクリックする
4. ツールのオプションタブのグラデーションバーの左下のグラデーションストップをダブルクリックする

上図のようにツールのオプションタブにあるグラデーションバーの左下のグラデーションストップ(水滴の形のアイコン)をダブルクリックします(スクロールしないと見えないかもしれません)。

  
グラデーションストップは色を設定するための基点です。 マウスの左ボタン(マウスの左ボタン)でダブルクリックすることで色を設定することができます。
5. 水色を選択する
5. 水色を選択する

上図のように『色を選択』ダイアログが開きますので、水色を選択して[OK]ボタンを押します。

6. 左側のグラデーションストップが水色に変化する
6. 左側のグラデーションストップが水色に変化する

上図のように左側のグラデーションストップの色が水色に変化します。

では、同様の手順で右側のグラデーションストップに緑色を設定してください

7. 右側のグラデーションストップを緑色に設定する
7. 右側のグラデーションストップを緑色に設定する

上図のように右側のグラデーションストップを緑色に設定します。

8. フィルが水色から緑色のグラデーションに塗られる
8. フィルが水色から緑色のグラデーションに塗られる

上図のように "背後の丸枠" のシェイプのフィルが水色から緑色のグラデーションに塗られます。

グラデーションストップについて

 

グラデーションストップは初期状態では両端の2つしかありませんが、グラデーションバー(右図)をクリックすることで "いつでも自由に" 追加することができます。

 

グラデーションストップを増やすことで、多段グラデーション(右図)をかけることができます。

 

グラデーションストップは簡単に削除することができます。 クリックでグラデーションストップを選択し、メニューボタン(右図)を押すと表示されるサブメニューから削除できます。

また、グラデーションストップはマウスの左ボタン(マウスの左ボタン)のドラッグで左右に位置を移動させることができます。

グラデーションストップの間隔を狭めることで変化を鋭くすることが、広げることで変化を緩やかにすることができます。

  
  

まとめ

シェイプやテキストのフィルやストロークの色は、"単色" だけでなく "グラデーション" にすることもできます。

グラデーションに切り替えると、色の基点となる "グラデーションストップ" が2つ出現します。 グラデーションストップをダブルクリックすることで色を設定することができます。

グラデーションストップを増やすことで、水色 -> 赤色 -> 緑色 -> 黄色 のような多段グラデーションをかけることができます。

グラデーションストップを移動して間隔を広げたり狭めたりすることで、色の変化の緩急を調整することができます。

操作/コマンド 説明
グラデーションバーのクリック グラデーションストップが追加される
グラデーションストップのクリック グラデーションストップが選択される
グラデーションストップのドラッグ グラデーションストップが移動する
[ハンバーガー]ボタン ->
"グラデーションストップを削除"
選択中のグラデーションストップが削除される