Cornflower Blueおすすめ配色20選｜カラーコード付きパレットアイデア

コーンフラワーブルーは、穏やかさとエネルギッシュさの絶妙なバランスを持ち、現代的なブランドパレットや親しみやすいUIテーマ、軽やかな印刷デザインの定番カラーとなっています。

以下にHEXコード付きの23種類のコーンフラワーブルーのカラーパレットアイデアをご紹介します。また、このブルーに合う色の選び方や、デザインをバランスよく意図的に仕上げるための実用的なアドバイスも取り上げます。

コーンフラワーブルーパレットがうまく機能する理由

コーンフラワーブルーは清潔感があり、開放的で楽観的な印象を与えるため、ランディングページからポスターまでレイアウトの明快さを自然にサポートします。鮮やかで現代的な印象を持ちつつ、純粋なプライマリーブルーよりも柔らかいので親しみやすさが保たれます。

また、暖色・寒色どちらの相性も良く、クリームやベージュと合わせれば爽やかなエディトリアル風に、深いネイビーやチャコールを加えるとUIや印刷でも読みやすいコントラストを生み出します。

最も重要なのは、コーンフラワーブルーが柔軟な色であること。主役として、落ち着いた背景色として、またはアクセントにも―周囲の彩度やコントラスト次第で様々な使い方ができます。

20種類以上のコーンフラワーブルーカラーパレットアイデア（HEXコード付き）

1）コースタルブリーズ

HEX： #6495ed #e7f2ff #1f2a44 #f6f1e6 #f2b8a2

雰囲気：みずみずしく軽やか

おすすめ用途：旅行用ランディングページUI

潮風が吹き抜ける明るい海岸のように、これらの色調がページを開放的でポジティブな印象に保ちます。淡いブルーやクリームをベースに、深いネイビーで読みやすさを確保。コーンフラワーブルーパレットは、ボタンや小さなハイライトにソフトピーチのアクセントを加えると特に相性が良いです。アドバイス：ピーチは小さなUI要素だけに用いることでブルーが主体になります。

media.ioで生成したコースタルブリーズのイメージ例

Media.io

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

今すぐ無料で試す

2）ヴィンテージポーセリン

HEX： #6b9df0 #f7f4ef #2e3a59 #c7d5f7 #b58b6a

雰囲気：クラシックで洗練

おすすめ用途：ウェディング招待状セット

やさしいブルーの釉薬と温かみのあるアンティークな縁取りが施された陶器のように、クラシックで洗練された印象。アイボリーと淡いブルーが紙面の多くを担い、ネイビーは見出しやモノグラムに。温かいタンは細い縁取りやワックスシールのアクセントに最適。アドバイス：ヴィンテージな柔らかさを保つためにコート紙を避けて印刷しましょう。

media.ioで生成したヴィンテージポーセリンのイメージ例

3）ネオンアーケード

HEX： #5a8cff #0b1020 #ff4fd8 #24e8d8 #ffe66d

雰囲気：エレクトリックで遊び心ある

おすすめ用途：音楽イベントポスター

アーケードのライトが深夜の光沢タイルに反射するような、電気的で遊び心いっぱいの雰囲気。深いほぼ黒の色を背景に使って明るい色を目立たせ、ブルーが見出しブロックを支える役割。マゼンタやアクアは競うようにアクセントとして使い、背景としては使わないのがコツ。アドバイス：十分な余白を作ってネオンが混乱せずシャープに見えるようにしましょう。

media.ioで生成したネオンアーケードのイメージ例

4）ダスティデニム

HEX： #6a8fd6 #dde5f5 #3a4766 #c9b8a6 #f1efe9

雰囲気：落ち着きとカジュアル

おすすめ用途：ライフスタイルブログテーマ

日焼けしたキャンバスの横にある使い古したデニムのように、落ち着きとカジュアルさが感じられる配色。オフホワイトと淡いブルーを使って読みやすいページを構成し、スレートネイビーでナビゲーションを支え、温かいベージュが手作り感をプラス。アドバイス：ベージュをセクションの区切りに使い、重厚なラインを避けましょう。

media.ioで生成したダスティデニムのイメージ例

5）ガーデンパーティ

HEX： #6495ed #eaf7f0 #2f6f5e #f7d6e0 #ffd28a

雰囲気：陽気でフローラル

おすすめ用途：春のSNSカルーセル

新鮮な花びらや柔らかな日差し、整ったピクニックテーブルを思わせる陽気でフローラルなカラーパレット。ブルーとミントで落ち着いたベースを作り、ブラッシュやアプリコットを層にしてアクションボタンを友好的に。キャプションには深いティールを使い読みやすさを維持。アドバイス：丸い形や余白を多く使って軽やかな雰囲気に。

media.ioで生成したガーデンパーティのイメージ例

6）ミッドナイトオブザーバトリー

HEX： #4f79d9 #0a1026 #202b4a #a9bdf2 #f5f0e6

雰囲気：ミステリアスで映画的

おすすめ用途：SF書籍カバー

望遠鏡ドームが夜空に開く瞬間のように、ミステリアスで映画的な雰囲気。濃いネイビーをドラマチックな土台にし、明るいブルーはタイトルや光の効果に活用。淡いラベンダーブルーは星の光のようにグラデーションやハイライトに使えます。アドバイス：クリームは小さな文字やロゴだけに使い、表紙の夜間イメージを保つと良いです。

media.ioで生成したミッドナイトオブザーバトリーのイメージ例

7）ノルディックミニマル

HEX： #6f9ff2 #ffffff #e9eef8 #2b2f3a #d6b36a

雰囲気：清潔感と現代的

おすすめ用途：SaaSダッシュボードUI

冬の日差しが明るいスカンジナビアのスタジオに入るような清潔で現代的な印象。ブルーは落ち着いたナビゲーションやグラフに最適、ホワイトやアイスグレーでインターフェースはすっきり。コーンフラワーブルーの組み合わせでも高級感を保つには、控えめなゴールドをハイライトやバッジに少し加えると良いでしょう。アドバイス：濃いチャコールはテキスト用途に限定して画面の明るさを保ちましょう。

media.ioで生成したノルディックミニマルのイメージ例

8）サンセットシトラス

HEX： #5f8fe8 #fff3e1 #ff8a3d #ffcf5a #2a3b6b

雰囲気：暖かく元気な印象

おすすめ用途：製品ローンチメールヘッダー

明るいキッチンカウンターに柑橘のスライスがサンセットと共に並ぶような、暖かくアップビートなカラー。クリームを開放的なベースにし、ブルーやネイビーでメッセージを際立たせ対比を作ります。オレンジとゴールドイエローは新機能や期間限定の強調にぴったり。アドバイス：暖色アクセントは一か所にまとめることで、レイアウトの意図が伝わります。

media.ioで生成したサンセットシトラスのイメージ例

9）ソフトナーサリー

HEX： #7aa6ff #f8f7ff #d7e6ff #ffd9e6 #9aa1b5

雰囲気：やさしくて安心感がある

おすすめ用途：ベビーシャワーフライヤー

やさしくて安心感があり、雲のような塗装の子供部屋の壁、淡いおもちゃややわらかいブランケットのイメージです。ほぼ白とパウダーブルーを主役にして、ピンクをふりかけて温かみと甘さを加えましょう。落ち着いたグレーは読みやすいディテールに最適です。ヒント：丸みのある親しみやすい書体を選ぶと、やわらかさが伝わります。

media.ioで生成したやわらかい子供部屋の画像例

10) アールデコホテル

HEX： #5b86e5 #101827 #f3e6c6 #c6a55b #2f3f74

雰囲気：豪華で構造的

おすすめ用途：ブランドアイデンティティムードボード

豪華で構造的、幾何学模様の床や磨かれた真鍮のある壮大なロビーを思わせます。濃いネイビーを背景にゴールドの文字やライン、コーンフラワーブルーを洗練されたアクセントとして加えると現代的な雰囲気に。クリーム色は印刷時の重さを和らげます。ヒント：シャープな左右対称と細い線を活かしてデコの雰囲気を演出しましょう。

media.ioで生成したアールデコホテルの画像例

11) マウンテンレイク

HEX： #6495ed #e6f0ff #2c4a6a #5a7d6b #f2e7d8

雰囲気：落ち着いた自然な雰囲気

おすすめ用途：自然ドキュメンタリーサムネイル

落ち着いたアウトドア感があり、澄んだ水や遠くの松、山からの涼しい風を感じさせます。鮮やかなブルーと常緑の色合いを合わせて本物の景色らしさを出し、暖かい砂色のニュートラルで寒色を和らげます。ディープスレートは明るい空や霧の水面でもタイトルを読みやすくします。ヒント：彩度は控えめにして自然な印象を保ちましょう。

media.ioで生成したマウンテンレイクの画像例

12) テックグラデーション

HEX： #4a7dff #a7c2ff #1b2340 #00d1c1 #f2f4ff

雰囲気：スタイリッシュで未来的

おすすめ用途：アプリのオンボーディング画面

スタイリッシュで未来的、暗いテックのキャンバスに輝くグラデーションが広がるイメージです。画面背景には深いブルーブラックを使い、明るいブルーを重ねて奥行きや進捗を表現します。ティールは主要アクションの現代的なアクセントです。ヒント：グラデーションは控えめに、テキストのコントラストを保ちましょう。

media.ioで生成したテックグラデーションの画像例

13) リネンとレース

HEX： #6c97ef #fbf7f0 #d9e2f5 #b08a7a #6b4f4b

雰囲気：ロマンティックでやわらかい

おすすめ用途：ブライダルブティックウェブサイト

ロマンティックでやわらかいイメージ、リネンの質感、レースのディテール、静かな朝の輝きが感じられます。クリームと淡いブルーをサイトの主役にすると写真が上品で軽やかに。暖かいトープ色をボタンや仕切りに、より深いココア色をヘッダーに。ヒント：シャドウは薄めにして繊細な雰囲気を守りましょう。

media.ioで生成したリネンとレースの画像例

14) コミックポップ

HEX： #5e8cff #ffffff #ff3b30 #ffd60a #1c1c1e

雰囲気：大胆でパンチがある

おすすめ用途：YouTubeチャンネルブランディング

大胆でパンチの効いたイメージ、シャープなインクラインと叫ぶような見出しでコミックパネルの雰囲気。ブランドのベースにブルーを使い、レッドとイエローをステッカーや目立つアテンションポイントに。ブラックは輪郭をシャープにし、サムネイルを小さいサイズでも読みやすくします。ヒント：レッドはタイルごとに一つのフォーカル要素まで、ビジュアルノイズを避けましょう。

media.ioで生成したコミックポップの画像例

15) スパセレニティ

HEX： #6a9af1 #f4fbff #bfe6e0 #7a8aa6 #f2dfc6

雰囲気：穏やかで清潔感

おすすめ用途：スキンケアパッケージ

穏やかで清潔感があり、冷たい水や新しいタオル、静かなスパの照明を連想させます。白と淡いブルーをラベルのベースに、コーンフラワーブルーはブランドマークと主な特徴に。シーフォームは健康的な印象を加え、温かみのある砂色は人間らしいパレットを保ちます。ヒント：マット仕上げを選ぶと、色が穏やかで光沢感なしに仕上がります。

media.ioで生成したスパセレニティの画像例

16) アカデミックライブラリー

HEX： #5d89e8 #f8f2e6 #2a3552 #8b6b4f #c9d7f4

雰囲気：学術的で暖かい

おすすめ用途：大学パンフレット

学術的で暖かい雰囲気、ハードカバー本やクリーム紙、静かな学習室を思い浮かべます。クリーム色は印刷用紙を模して、ブルーはセクション見出しや注目要素に。ブラウンはアイコンや区切り線、引用に適した落ち着いたアクセントです。ヒント：ネイビーは本文ブロックにして快適なコントラストを確保しましょう。

media.ioで生成したアカデミックライブラリーの画像例

17) トロピカルサーフ

HEX： #6495ed #e9fbff #00b3b8 #ff6f61 #ffe3a3

雰囲気：明るくてビーチ感

おすすめ用途：夏のセールバナー

明るくてビーチ感、サーフワックスやターコイズの水、珊瑚の夕焼けをイメージ。ブルーとアクアを最も大きな形に使い、コーラルで価格やボタンに急ぎ感を加えます。淡いイエローはバナー全体を晴れやかにし、ブルーを邪魔しません。ヒント：濃いシャドウを避けて軽く夏らしい印象を保ちましょう。

media.ioで生成したトロピカルサーフの画像例

18) ウィンターフロスト

HEX： #6b9df0 #f7fbff #cfdaf0 #3b4a6b #d7c7ff

雰囲気：冷たくて静か

おすすめ用途：ホリデーグリーティングカード

冷たくて静かなイメージ、凍った窓や雪に覆われた薄明の風景を思い起こさせます。ほぼ白の背景とクールなブルーでイラストを、ダークスレートで挨拶文や名前を。ラベンダーのアクセントは幻想的な輝きを加え、甘くなりすぎません。ヒント：印刷時は微細なグレインを足して無味乾燥な白を避けましょう。

media.ioで生成したウィンターフロストの画像例

19) クレイスタジオ

HEX： #5f8be6 #f3ede3 #c86b4a #7a6b63 #d7c3a6

雰囲気：職人的で自然な雰囲気

おすすめ用途：陶器ショップ商品ページ

職人的で自然なイメージ、テラコッタの粉や日差しの棚が感じられる陶芸スタジオです。暖かいクリームやクレイを背景と商品枠に使い、ブルーはリンクやバッジ、信用の印象づけに。チャコールトープはテキストを落ち着かせます。ヒント：自然な質感と組み合わせ、UIの線は細くクリーンに保ちましょう。

media.ioで生成したクレイスタジオの画像例

20) ギャラクティックアイリス

HEX： #5a86ff #1a1033 #7b4dff #ff4fa3 #f1f0ff

雰囲気：夢幻的でコスミック

おすすめ用途：フェスティバルフライヤー

夢幻的で宇宙的なイメージ、青紫の星雲や鮮やかなブルースパーク、ネオンロマンスのタッチ。ベースには深いインディゴ、ブルーとバイオレットはグラデーションや形状に。夜のモダンさにはコーンフラワーブルーの組み合わせを、ホットピンクは小さいインパクトアクセントに。ヒント：本文は淡いラベンダーホワイトにして読みやすさを保ちましょう。

media.ioで生成したギャラクティックアイリスの画像例

21) カフェブルーアワー

HEX： #6495ed #f5efe6 #2d2a32 #c39b77 #d8e6ff

雰囲気：居心地よくムーディー

おすすめ用途：コーヒーショップメニュー

居心地よくムーディーな雰囲気、カフェの窓からのブルーアワーと店内の暖かい木ややわらかな影。メニューにはクリーム色を、見出しは深いチャコールで高級感を。暖かいキャラメルは価格や小アイコンにぴったり、ブルーで穏やかな個性をプラス。ヒント：ブルーはセクションタイトルだけに使い、メニュー全体を美味しく暖かく保ちましょう。

media.ioで生成したカフェブルーアワーの画像例

22) クリーンクリニカル

HEX： #5b90f6 #ffffff #e6efff #2b3a55 #7bd3ff

雰囲気：信頼感とシャープさ

おすすめ用途：ヘルスケアアプリUI

信頼感とシャープさ、清潔な廊下や明快なチャート、落ち着いた安心感のイメージです。ほとんどの面にはホワイトと淡いブルーを、深いネイビーは文字やナビゲーションに。明るいスカイアクセントは成功時やフレンドリーな強調に最適。ヒント：フォームラベルのコントラストは高くしてアクセシビリティ向上を心がけましょう。

media.ioで生成したクリーンクリニカルの画像例

23) マスタードアクセントクラシック

HEX： #6a98ff #f7f2e8 #d6a21f #2a3556 #c7d7ff

雰囲気：自信に満ちてバランス感あり

おすすめ用途：スタートアップピッチデック

自信がありバランスの取れた印象で、まるで金色のポケットチーフをあしらったシャープなブレザーのようです。チャートにはクリーム色のスライドと柔らかな青色を使い、見出しや構造にはネイビーを取り入れましょう。このヤグルマギクブルーのカラーパレットは、特に指標や強調ポイントにマスタードを加えることで、より一層のエネルギーが生まれます。ポイント：マスタードは1枚のスライドに1箇所のアクセントに留めることで、高級感が保たれます。

media.io を使用して生成された、マスタードアクセントクラシックの画像例

コーンフラワーブルーに合う色は？

クリーム、アイボリー、サンド、ライト トープなどの暖かみのあるニュートラルカラーはヤグルマギクブルーを柔らかくし、上質でエディトリアルな雰囲気を演出します。落ち着きと明瞭さを求めるWebサイト・パッケージ・印刷物に最適な安定した選択です。

コントラストとアクセシビリティのためには、ヤグルマギクブルーに濃紺やチャコール、ほぼ黒を組み合わせましょう。濃い色合いがタイポグラフィを読みやすく保ちつつ、ブルーを過度に強調せず鮮やかに見せます。

もっと活力を出したい場合は、ピーチ、コーラル、オレンジ、またはマスタードといった暖色アクセントを加えます。これらの鮮やかな色は「シグナルカラー」（ボタン、バッジ、ハイライト）としてごく小さく使用し、全体のバランスを保ちましょう。

実際のデザインでコーンフラワーブルーカラーパレットを使う方法

まずロール割り当てから始めましょう。背景用に1つ明るい中立色、テキスト用に濃い色合い、ヤグルマギクブルーをメインブランド／UIカラーにします。この構成で「青が多すぎる」事態を防ぎながら一体感をキープできます。

UIでは、インタラクティブな状態（リンク、メインボタン、フォーカスリング）にヤグルマギクブルーを使用し、大きな面は白、アイスグレー、淡いブルーに保ちます。清潔感と現代的な印象を与えつつ、可読性のためのコントラストも維持できます。

印刷物では、選んだ用紙で青がどのように再現されるかテストしましょう。非コート紙なら青が柔らかくなり、光沢仕上げなら明るさが増します。制作でブルーがパープル寄り・シアン寄りになったら、彩度を少し調整しましょう。

AIでコーンフラワーブルーパレットビジュアルを作成

すでにHEXコードがあれば、ポスター、ブランドムードボード、ランディングページ、パッケージなど、パレットに合わせたスタイリングのビジュアルを生成して、即座にモックアップ化できます。

パレット名をコンセプトに使い、色をプロンプトに貼り付ける（または説明する）ことで、用途に合ったアスペクト比例（例えばヒーローセクションなら16:9、チラシなら3:4など）を指定できます。

Media.ioのテキストから画像生成なら、素早く繰り返し検討できます。コントラスト調整、余白追加、アクセント（マスタードとコーラルなど）の入れ替えもでき、ブランドに合ったデザインに仕上げられます。

次へ： マスタードカラーパレット