おすすめ寒色系配色20選｜カラーコード・AIデザイン提案

寒色のカラーパレットはブルー、ティール、青緑、クールグレーを中心に、シャープでモダンな印象を与えます。UIやブランディング、印刷レイアウトで明快さや落ち着きが求められる時によく使われます。

以下に20種類の寒色系カラーパレット案とHEXコード、さらに実際の使用アドバイスやAIプロンプトをまとめました。素早くマッチするビジュアルを生成する際にご活用ください。

なぜ寒色パレットは使いやすいのか

寒色系のカラーは空気や水、ガラス、金属を連想させるため、清潔感と統制の取れた印象を与えます。このイメージが現代的なUIやデータ中心の画面、落ち着きと自信を表現したいブランドに理想的です。

クールトーンは階層を整理するのにも役立ちます。淡い氷色で余白が広く、ミッドトーンはインタラクティブな状態を担い、濃いネイビーは重要なUIやテキストのコントラストを高めます。

印刷やブランドでは、寒色パレットと余白、アクセントの組み合わせでプレミアムかつミニマルな雰囲気を出せます。ポイントはコントラストの調整で、平坦や冷たすぎる印象にならないようにすることです。

20以上の寒色カラーパレット案（HEXコード付き）

1）アークティックミスト

HEX: #EAF6FF #BFDFFF #7FB6E6 #3E7FB1 #1E3A5F

ムード: シャープ、空気感、清潔感

最適用途: SaaSダッシュボードUI

氷上の朝霧のようにシャープで空気感のあるブルー。アナリティクスダッシュボードやフィンテックUI、データ重視のレイアウトに最適です。余白やネイビーと組み合わせて読みやすい階層を作り、最も濃い色はCTAやチャートラベルなどキーの部分に使うとコントラストを保てます。

media.ioで生成したアークティックミストの画像例

Media.io

Media.ioはブラウザで動画・画像・音声の作成・編集ができるオンラインAIスタジオです。

無料で今すぐ試す

2）グレイシャーベイ

HEX: #D7FAFF #8FE7F2 #39C3D6 #0D7C91 #053B47

ムード:フレッシュ、水感、自信

最適用途:ウェルネスブランドのアイデンティティ

フレッシュで水のようなグレイシャーベイは氷河の水と透明な空間を感じさせます。ウェルネスやスキンケア、冷静な権威を伝えたいアプリに適しています。サンドやオートミールなど温かなニュートラルを合わせれば、冷たさが和らぎつつ明快さを保てます。ティールはロゴ、濃い色はヘッダーや小さなテキストに。

media.ioで生成したグレイシャーベイの画像例

3）フロステッドデニム

HEX: #E6EEF8 #B9CDE6 #6F93BF #3E5E86 #1F2F44

ムード:信頼感、モダン、構造的

最適用途:企業プレゼンテーションスライド

信頼と構造を感じさせる寒色系。冬の空気を纏ったデニムのようで、企業デックや投資家向けレポート、プロフェッショナルな資料におすすめ。淡いブルーはスライド背景、ミッドブルーはデータの強調に。静かなシルバーグレーや余白と組み合わせるのがポイント。

media.ioで生成したフロステッドデニムの画像例

4）ウィンターパイン

HEX: #E8F5F1 #BFE6D9 #5CBCA2 #1F7A63 #0E3A2F

ムード:常緑、しっかり感、リフレッシュ

最適用途:エコ商品パッケージ

雪の後の針葉樹のような、自然で濁りのないグリーン。エコパッケージや詰め替え、サステナブルなリテールラベルに合います。未加工紙やチャコールでタイポグラフィを合わせ、濃いグリーンは成分リストなど小さな文字に使うと良いでしょう。

media.ioで生成したウィンターパインの画像例

5）ポーラーオーキッド

HEX: #F2F0FF #D6D0FF #A79BEE #6B5ACD #2E2A66

ムード:夢、クール、エレガント

最適用途:ビューティーエディトリアルレイアウト

夢のように涼しく、薄暮の花びらや柔らかなスタジオライトを想起させるパープル。ビューティーエディトリアルやフレグランス、ハイエンドのルックブックに向いています。氷色のグレー写真や細いセリフ見出しと組み合わせると洗練された印象。ミッドバイオレットは引用に、本文は最も濃い紫にすると読みやすいです。

media.ioで生成したポーラーオーキッドの画像例

6）スティールリバー

HEX: #F3F6F9 #CBD5E1 #8FA3B8 #4B647D #223040

ムード:穏やか、インダストリアル、ミニマル

最適用途:アプリの設定画面

穏やかでインダストリアル、金属の空と川のようなグレー。設定画面や管理ツール、ユーティリティ製品に最適です。鮮やかなアクセント（シアンやライム）と組み合わせてトグルやステータスバッジに。背景はほぼ白、濃い色は主テキストのみに使うのがポイント。

media.ioで生成したスティールリバーの画像例

7）スノーラベンダー

HEX: #F8F6FF #E6E0FF #C6B8F2 #8B7CCB #3A3159

ムード:柔らかい、心地よい、控えめ

最適用途:ウェディング招待状セット

雪化粧したラベンダー畑のようにロマンチックかつモダン。寒色の組み合わせはウェディング一式やベビーアナウンス、柔らかなイベントブランドにぴったり。マットな白紙やクールグレーは封筒やRSVPカードに。淡い色はインクを多くして印刷すると色が消えません。

media.ioで生成したスノーラベンダーの画像例

8）アイシーシトラス

HEX: #E9FFFB #BFF7EA #6FE7D0 #2DB7A3 #0F4D47

ムード:明るい、エネルギッシュ、清潔

最適用途:夏の飲料ポスター

明るくエネルギッシュで、冷たい柑橘を感じさせるスパークリングウォーターのイメージ。ポスターやメニューボード、即時の鮮度が必要なSNS広告におすすめ。太めのブラック文字やオフホワイトを組み合わせればグリーンがより輝きます。ミントはバッジや価格帯など小さな箇所に限定使用がおすすめ。

media.ioで生成したアイシーシトラスの画像例

9）ノーザンライツ

HEX: #071A2B #0E3B5A #0FA3B1 #7AE582 #D9F7FF

ムード:エレクトリック、冒険的、シネマティック

最適用途:ゲーム配信ストリームオーバーレイ

エレクトリックで映画的、オーロラを思わせる鮮やかなコントラスト。ゲーム配信オーバーレイやTwitchパネル、ネオン風ヒーローバナーに最適です。凝縮フォントや微妙なグラデーションで光の効果をコントロール。ネイビーはメイン背景に、グリーンはライブ表示やハイライトに限定すると良いでしょう。

media.io によって生成された北極光の画像例

10) 深海ガラス

HEX: #E6FBFF #A9E5F2 #4FB8CC #1A6D80 #0B2F3A

ムード:クール、洗練、海洋的

最適用途:テックランディングページ

クールかつ洗練された印象は、深い水で磨かれた海ガラスのようです。ブルーやティールの組み合わせは、テック系ランディングページやSaaSのヘッダー、特集セクションに最適です。視覚ノイズを避けるため、シャープな白カードと控えめなアクセントアイコンセットと組み合わせてください。使用のコツ：リンクには中間のティールを使い、ボタンは非常に明るいかとても暗い色にして明確な状態を保ちましょう。

media.io によって生成された深海ガラスの画像例

11) ブルーアワー

HEX: #0B1026 #1B2A4A #2F4F7A #6B8FBF #E7F0FF

ムード:ムーディー、高級、集中

最適用途:高級時計広告

ムーディーで高級感があり、夜の前のブルーアワーの静かな深みを表現します。これらのトーンは高級広告、商品ヒーローショット、高コントラストのブランディングに適しています。ミニマルなコピー、メタリックアクセント、広い余白と組み合わせることで高級感を演出できます。使用のコツ：最も明るい色は微妙なリムライトや背景グラデーションとして使い、フラットな塗りには使わないでください。

media.io によって生成されたブルーアワーの画像例

12) スレートハーバー

HEX: #F2F4F7 #D1D7DE #9AA6B2 #566575 #2B3440

ムード:安定、プロフェッショナル、バランス

最適用途:年次報告書レイアウト

安定感とプロフェッショナルさは、港の石や曇った水を思わせます。こうした寒色系の組み合わせは年次報告書、ケーススタディ、B2B PDF に最適です。1つの控えめなブルーアクセントとクリーングリッドタイポグラフィと組み合わせることで、ページの読みやすさを保てます。使用のコツ：中間のスレートでルールやテーブルを作り、しっかり構造化されたレイアウトにしつつ重い線にならないようにしましょう。

media.io によって生成されたスレートハーバーの画像例

13) クリスタルスカイ

HEX: #F4FBFF #D6F1FF #9FD9FF #4FA6E8 #1F4E79

ムード:明るい、開放的、モダン

最適用途:教育アプリのオンボーディング

明るく開放的で、雪が降った後の澄んだ空のような印象です。明るい青から深い青へのグラデーションは、フレンドリーなオンボーディング画面や学習アプリなど、明瞭さが重要な場面に適しています。丸みのあるアイコンや柔らかいイラストと組み合わせると、歓迎する雰囲気になります。使用のコツ：最も明るい青は進捗状態や成功メッセージ用にして、長文には使わないでください。

media.io によって生成されたクリスタルスカイの画像例

14) クールコンクリート

HEX: #F7F7F8 #D9DDE2 #AAB3BF #6C7785 #2E333A

ムード:都市的、中立、ミニマル

最適用途:建築ポートフォリオサイト

都市的でミニマル、コンクリートやスチール、柔らかな影を連想させます。ニュートラルグレーは写真やレイアウトが際立つポートフォリオやスタジオサイトに最適です。リンクやホバーにはクールアクセント（アイシーブルー）を1つだけ組み合わせてください。使用のコツ：最も暗いグレーは少量だけ使い、デザインが重くならないようにしましょう。

media.io によって生成されたクールコンクリートの画像例

15) ミントシャドウ

HEX: #F1FFFA #CFF7E8 #86DFC2 #3CA58E #1C4C46

ムード:クリーン、穏やか、親しみやすい

最適用途:ヘルスケアクリニックパンフレット

クリーンで穏やか、ミントの葉で和らげられた清潔な新鮮さを感じさせます。寒色系のパレットはヘルスケアパンフレット、クリニックのサイト、患者に優しいフォームに適しています。暖かいグレーの本文やシンプルなラインアイコンと組み合わせて、親しみやすい雰囲気を保つことができます。使用のコツ：セクションヘッダーには暗めのティールを使うことで、明るい色を空気感のある状態に保てます。

media.io によって生成されたミントシャドウの画像例

16) アルパインダスク

HEX: #0E1B2A #233B55 #3A6D8C #7FB2C6 #DCEFF5

ムード:アウトドア、穏やか、力強い

最適用途:トラベルブログヘッダー

アウトドアで穏やかな雰囲気は、黄昏時の山の湖やトレイルの冷たい空気を思わせます。ブルーはトラベルブログヘッダーや旅程グラフィック、写真中心のストーリーテリングに適しています。紙の質感や控えめなタン色をキャプションに組み合わせることで、コントラストを与えつつ過度な暖かさにならずに済みます。使用のコツ：最も暗い色はナビゲーションに使い、画像上でも読みやすさを保ちましょう。

media.io によって生成されたアルパインダスクの画像例

17) インクとアイス

HEX: #0A1220 #1A2E4A #2F6E9C #A7D7F5 #F2FBFF

ムード:シャープ、高コントラスト、モダン

最適用途:ダークモード UI キット

シャープで高コントラスト、凍ったガラスにインクの線が引かれているような雰囲気です。ダークモード UI キットやコードエディター、アクセシビリティ重視のインターフェイスに最適です。セカンダリーテキストにはニュートラルグレーを使い、インタラクティブ時は明るいブルーを使用しましょう。使用のコツ：小さなサイズでコントラストをテストし、最も明るい色は細いアイコンには使わないようにしましょう。

media.io によって生成されたインクとアイスの画像例

18) シルバースプルース

HEX: #F3FAF7 #D0E8DF #90BFB0 #4E7A6C #233E37

ムード:ナチュラル、クール、洗練

最適用途:アウトドアブランドロゴシステム

ナチュラルでクール、銀色の光沢を持つスプルースの枝を彷彿とさせます。グリーンやブルーグレーはアウトドアブランドや高級コーヒーラベル、ミニマルなグッズに適しています。オフホワイトやダークチャコールと組み合わせると、パレットがスポーティーではなく洗練された印象になります。使用のコツ：中程度のグリーンはセカンダリーロゴやバッジに使い、一貫性を高めましょう。

media.io によって生成されたシルバースプルースの画像例

19) ペリウィンクルドリフト

HEX: #F5F6FF #DDE1FF #AEB6F4 #6A77D6 #2C336E

ムード:柔らかい、クリエイティブ、テック系

最適用途:プロダクティビティアプリイラスト

柔らかくクリエイティブ、冬空を漂うペリウィンクル色の雲のような印象です。バイオレットはプロダクティビティアプリやオンボーディングイラスト、遊び心がありつつ成熟したブランドに適しています。ソフトグレーのラインワークやライム色のポップをミクロインタラクションに加えるのも良いでしょう。使用のコツ：イラストの影には中間のペリウィンクル色を一貫して使い、セット全体の統一感を保ってください。

media.io によって生成されたペリウィンクルドリフトの画像例

20) オーシャンフォグ

HEX: #F0F7F8 #CFE2E6 #8FB6C1 #4E7C89 #1F3A43

ムード:静か、沿岸、成熟

最適用途:スパサイトリニューアル

静かで沿岸の雰囲気は、冷たい海岸に霧が立ち込めるような印象です。寒色系パレットはスパやブティックホテル、落ち着いたサービスブランドの成熟した印象に適しています。写真には暖かいベージュのアクセントを加え、タイポグラフィは余裕のある行間で空気感を保ちましょう。使用のコツ：控えめなティールをボタンに使い、最も暗い色はフッターやナビゲーションに reserved してください。

media.io によって生成されたオーシャンフォグの画像例

寒色系に合う色は？

寒色系はホワイト、オフホワイト、クールグレーなどのクリーンなニュートラル色と特に相性が良く、パレットの明瞭さを保ちます。読みやすさが最優先のUIや商品ページ、編集レイアウトに最も安全な選択です。

無機的な雰囲気を避けるには、コントロールされた暖色系を追加しましょう：砂色、オートミール、ライトタン、控えめなゴールドアクセントなど。バッジ、アイコン、区切りなど、少し暖色を加えるだけでも寒色パレットがより人間味を感じさせます。

より大胆なコントラストが欲しい場合は、近い黒のネイビーやチャコールでタイポグラフィや構造を強調し、鮮やかな寒色アクセント（シアン、ミント、ティール）はインタラクションや主要なハイライト用に reserved してください。

実際のデザインで寒色パレットを使う方法

まず役割から決めてください：背景用に明るい色、UIエレメント用に中間色、テキストやナビゲーション用に深い色を選びましょう。そうするとシステムが画面間で一貫し、「ランダムなブルー」ドリフトを防げます。

特にアイシーパステルはコントラストに注意してください。パレットが非常に明るい場合は、タイポカラーを暗めにしたり、小さなテキストや細いアイコン、無効状態をテストしてアクセシビリティを確保しましょう。

印刷では寒色の淡い色は未加工紙で色飛びしやすいです。インク密度を少し増やし、成分表やキャプション、脚注など小さなタイポには深い寒色を使うのがおすすめです。

AIで寒色パレットのビジュアルを作成

HEXコードが既にある場合、レイアウト（UI、ポスター、パッケージ）や雰囲気（シャープ、ミニマル、オーシャン）を指定してモックアップやグラフィックを生成できます。プロンプトはスタイル（2D/フラット vs リアル）や構成（無地背景、手なし）を具体的に指定しましょう。

一貫性のため、資産ごとに同じプロンプト構成を繰り返し、主題（ダッシュボード、ブランドボード、パンフレット）のみを変更してみてください。その後、1つの変数（照明、タイポグラフィ、アクセントカラー）だけ調整すればビジュアルシステムが統一されます。

次へ： ティール＆ゴールドカラーパレット