「おしゃれな配色」にしたいのに、なんとなく普通で垢抜けない…
と感じることはありませんか?
おしゃれに見えるグラデーションは、派手さではなく色の距離感とトーン統一で決まります。
この記事では、
をまとめてご紹介いたします。
Web・バナー・Instagram・資料等の参考にもおすすめです。
おしゃれグラデーションの基本ルール

強い色より、ニュアンスカラー中心が正解です。
おしゃれグラデーション配色パターン集
ここからは、おしゃれグラデーション配色パターン集を5つご紹介していきます。
モニター環境や印刷条件によって、色味が多少異なって見える場合があります。
あくまで参考値としてご活用ください。
①グレージュ
S T Y L I S H
ナチュラルで上品な雰囲気のグレージュグラデーション。
ブログ・ブランドサイト・美容系におすすめです。
| カラー | カラーコード | RGB |
| グレージュ | #B8B0A4 | 184, 176, 164 |
| ベージュ | # | 231, 225, 216 |
| アイボリー | # | 250, 247, 242 |
②くすみピンク
S T Y L I S H
大人かわいい印象の、くすみピンクグラデーション。
Instagram・LP・バナーなど、女性向けです。
| カラー | カラーコード | RGB |
| モーブ | #9D8189 | 157, 129, 137 |
| くすみピンク | # | 216, 167, 177 |
| パウダーピンク | # | 245, 230, 234 |
③セージグリーン
S T Y L I S H
癒し系のセージグリーンのグラデーション。
ライフスタイル・カフェ・資料に。
| カラー | カラーコード | RGB |
| セージグリーン | #84A98C | 132, 169, 140 |
| アイスグリーン | #CFE3D8 | 207, 227, 216 |
| パールグリーン | #F1F5F2 | 241, 245, 242 |
④ネイビー×ブルーグレー
S T Y L I S H
知的でシンプルなグレー系グラデーション。
ビジネス・スライド・Webなどに最適です。
| カラー | カラーコード | RGB |
| ダークネイビー | #0F172A | 15, 23, 42 |
| グレーネイビー | # | 51, 65, 85 |
| ブルーグレー | #94A3B8 | 148, 163, 184 |
⑤テラコッタ×クリーム
S T Y L I S H
ほっこりとしたカラーの、テラコッタオレンジグラデーション。
EC・カフェ・ブランドなどに使いやすいデザインです。
| カラー | カラーコード | RGB |
| テラコッタ | #C97B63 | 201, 123, 99 |
| サンドイエロー | # | 233, 196, 106 |
| クリーム | # | 255, 247, 237 |
おしゃれグラデーション配色のNG例
おしゃれは、弱め・少なめ・くすみ寄りが正解です。
まとめ
おしゃれなグラデーションは、主張しすぎないことが最大のコツ。
くすみカラーを中心に、余白を活かすことで、一気にプロっぽい配色になります。


コメント