Photoshopで文字にグラデーションをかけるだけで印象を大きく変えることができます。
方法も簡単なのでひと手間かけるだけでバナー画像やアイキャッチ画像のクオリティがアップしますよ！
今回はPhotoshopで文字にグラデーションをかける方法について紹介します。
目次
Photoshopで文字にグラデーションをかける方法
やり方はとっても簡単です。手順を解説します。
文字を書く
まず『文字ツール』を使ってテキストを書きます。テキストの色は何でもOK。（色は後で調整します）
レイヤースタイルの追加からグラデーションオーバーレイを選ぶ
次に『レイヤーパネル』から『レイヤースタイルの追加』をクリックして『グラデーションオーバーレイ』を選びます。
するとグラデーションオーバーレイのダイアログ（設定画面）が開きます。
ここから色など調整していきます。
グラデーションの色を調整する
まず『グラデーション』のバーをクリックします。
『グラデーションエディター』が開きますので、下の箇所の『描画色から背景色へ』を選びます。
次にグラデーションバーの下側にある２ヶ所のポイントの色を変更します。ポイントをダブルクリックすると『カラーピッカー』が開きますので好きな色を選びましょう。
ここで指定した色から色へとグラデーションで変化します。
今回は左側のポイントを濃いオレンジ『#f0ac19』、右側のポイントを薄いオレンジ『#f3ce7d』にしてみました。
するとテキストに綺麗なグラデーションがかかりました。
グラデーションの設定を色々いじってみよう。
グラデーションのダイアログの設定をいじると色んな表現ができます。
色を逆方向に変える
『逆方向』にチェックを入れるとグラデーションの色の変化を反転することができます。
逆方向にチェックを入れると色が反転して『下側が薄いオレンジ』→『上側が濃いオレンジ』に変わりました。
角度を変更する
角度を変更するとグラデーションの方向を変えることができます。
90℃だと縦方向に変化、180℃だと横方向に変化します。
スタイルを変更してみる
ダイアログの『スタイル』から『線形』・『円形」・『角度』・『反射』・『菱形』の５つのスタイルが選べます。
最もよく使うのが『線形』です。『反射』も文字装飾だとけっこう使いますね。
↑『反射』にすると文字の中心部分から上下にグラデーションがかかります。（反転すると逆に）
グラデーションのクオリティをアップさせるコツ
応用編としてグラデーションのクオリティをアップさせるコツを紹介します。
グラデーションの色は同系色にすると綺麗
２ヶ所に設定した色を同系色にすると綺麗なグラデーションになります。
今回の場合だと下の画像の位置で指定しています。
カラーピッカーの色相のカーソルは変えずに『濃い色』と『薄い色』を指定するのがポイントです。
ちなみにオレンジの反対色（ブルー）でグラデーションをかけるとこんな感じ。
どキツイ感じになっちゃいました（汗）
比率を調整してみよう
ダイアログに『比率』という項目があるのでここの％を調整すると印象が変わります。
下は『10％』と『150％』の比較画像です。
％の数字が小さいとグラデーションの境目が急になります。大きいと境目が緩やかになります。
ドラッグしてグラデーションの境目の位置を変える
グラデーションのダイアログを開いた状態で文字にカーソルを合わせてドラッグするとグラデーションの位置を変えることができます。
下の画像のようにグラデーションの位置を高くしたり低くしたりできます。
最後にグラデーションをかけない状態とかけた状態の比較画像を紹介します。
こちらがグラデーション無し。
こちらがグラデーション有りです。
柔らかい印象になりました。
まとめ
Photoshopで文字にグラデーションをかける方法とコツを紹介しました。
Web上のバナー画像やアイキャッチ画像もそうですし、街中の広告などを見ると文字にグラデーションをかけたデザインはよくあります。
色々なデザインをチェックしてみると参考になります。
他の文字とのバランスなどをみて「なぜこの文字はグラデーションをかけたのか」考えてみるのも勉強になりますよ。
今日はこのへんで。
それではまた！
