おしゃれなゴールド×ブルー配色20選｜カラーコード付き

ゴールドとブルーはモダンなクラシックです。金属の温もりは格式を高め、ブルーは落ち着きや明解さ、構造をもたらします。組み合わせることで、うるさすぎることなく自信のあるコントラストを生み出します。

以下はブランド、UI、結婚式、パッケージング、エディトリアルレイアウトなどで使えるゴールド×ブルーの配色アイデアです。各パレットにはHEXコードと再利用可能なAIプロンプトも付いています。

ゴールド×ブルーパレットがなぜこれほど効果的なのか

ゴールドとブルーは自然にお互いをバランスさせます。ゴールドは高級感と人間味、ブルーは信頼性と安心感を示します。このコントラストにより、デザインは憧れと信頼性の両方を感じさせます。

ブルーは、構成要素（ナビゲーション、見出し、背景ブロックなど）に強い構造を与え、ゴールドはハイライトに最適です。この役割分担により、余計な色を加えずに明確な階層構造を作れます。

ゴールドはフラットなHEX値でも「金属感」が感じられるため、高級感をビジュアルで強調しすぎずに伝えたいブランディングやパッケージング、UIで特に効果的です。

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

1) ギルデッドハーバー

HEX： #0b1f3b #0f4c81 #2f86c7 #d4af37 #f3efe6

雰囲気： 海洋、洗練、自信

おすすめ用途： 高級ホテルのブランディングやウェブサイトのヒーローセクション

洗練された海洋テイストで、夕暮れの深い港に磨かれた真鍮のような印象です。信頼が重要な高級ホスピタリティ、旅行、マリンブランドに適しています。ゴールドは暖かみのあるオフホワイトのタイポグラフィと合わせ、ブルーで大きな背景を構成しましょう。使い方のコツ：ゴールドはボタン、アイコン、細い罫線にとどめ、上質な仕上がりに。

media.ioで生成したギルデッドハーバーの画像例

Media.io

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

今すぐ無料で試す

2) ロイヤルレガッタ

HEX： #0a2342 #1d4ed8 #60a5fa #f5d76e #ffffff

雰囲気： スポーティー、明るい、祝祭感

おすすめ用途： チームポスターやスポーツイベントのプロモーション

スポーティーで祝祭感があり、青空の下で鮮やかな旗が立ち並ぶような雰囲気。鮮やかなロイヤルブルーがエネルギッシュさを保ち、柔らかなゴールドがトロフィーのような輝きを加えます。クリアなサンセリフ体と十分な余白で視覚的なノイズを抑えましょう。使い方のコツ：ライトブルーはサブ的な強調に残し、見出しは一番濃いネイビーで。

media.ioで生成したロイヤルレガッタの画像例

3) ミッドナイトクラウン

HEX： #06121f #102a43 #1e5aa8 #c9a227 #e8edf2

雰囲気： ドラマチック、威厳、ハイコントラスト

おすすめ用途： 高級パッケージ・香水ラベル

ドラマチックかつ威厳があり、ベルベットの夜と王冠の金属光沢を感じさせます。ほぼ黒のネイビーがゴールドをより深く意図的に見せます。エンボス調のテクスチャ、細身のセリフ書体、少数の差し色が好相性。使い方のコツ：ゴールドはフロントラベルのマークだけに限定し、パッケージがごちゃごちゃしないように。

media.ioで生成したミッドナイトクラウンの画像例

4) デザートサファイア

HEX： #0e3a5d #2b78b8 #9ad0f5 #d8b24a #f7f3e8

雰囲気： 陽光、軽やか、ウェルカム

おすすめ用途： サマーウェディング招待状やメニュー

陽光に包まれた砂浜のゴールドと澄んだ青空のように、軽やかで親しみやすい配色です。ソフトなクリームでやさしい印象かつ印刷にも適します。ちぎり紙のようなテクスチャや水彩風の柔らかい色合いと合わせるとロマンチック。使い方のコツ：ゴールドは細枠やモノグラムなど、抑え目に入れるのが上品です。

media.ioで生成したデザートサファイアの画像例

5) アールデコベイ

HEX： #0b2d5c #1f6feb #7db7ff #b88a2b #f0e6d2

雰囲気： グラマラス、幾何学的、ヴィンテージモダン

おすすめ用途： カクテルバーメニューやナイトライフのブランディング

グラマラスで幾何学的、アールデコのゴールドラインが力強いブルータイルに映える印象です。暖かな金属色はシャープな角や繰り返しパターンと好相性。ブラックのアクセント、細い罫線、コンデンス体のディスプレイ書体で仕上げると◎。使い方のコツ：背景はネイビーで、ゴールドは見出しやアイコンだけに限定しましょう。

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

6) セレスティアルメダル

HEX： #0a1633 #123b7a #3b82f6 #f2c94c #e6e8ef

雰囲気： クリーン、先進的、前向き

おすすめ用途： SaaSダッシュボードやフィンテックUI

クリーンでテック感があり、澄んだ夜空に輝く星明かりのゴールドを思わせます。明るい青はグラフやインタラクティブな要素を明快にサポート。クールグレーや十分な余白と合わせ、見やすい複雑な画面に。使い方のコツ：ゴールドは成功の強調だけに使い、意味を際立たせましょう。

media.ioで生成したセレスティアルメダルの画像例

7) コースタルトレジャー

HEX： #08304b #0f6aa6 #7cc4f2 #d9a441 #fbfaf6

雰囲気： さわやか、海辺、親しみやすい

おすすめ用途： 旅行広告やビーチリゾートSNSグラフィック

さわやかな海辺の雰囲気で、コインが海中のブルーに光るような感覚を演出します。明るめのブルーはSNS投稿やバナーに親しみやすく最適。サンドベージュ系や丸みのある書体を組み合わせて、招き入れる雰囲気を。使い方のコツ：ミッドブルーはボタン、淡いブルーは背景でコントラストを確保。

media.ioで生成したコースタルトレジャーの画像例

8) ウィンターオーラム

HEX： #0b1b2b #274690 #a9c7ff #caa13a #f7f8fb

雰囲気： クール、洗練、ミニマル

おすすめ用途： 企業年次報告書やスライド資料

クールで洗練されており、氷のようなブルーと控えめなオーラム（ゴールド）の輝き。アイスブルーが情報量の多いページも軽やかで現代的に仕上げます。細かいグリッド、繊細な罫線、ニュートラルなサンセリフ書体と合わせて可読性もUP。使い方のコツ：ゴールドはセクション区切りや要点だけに使い、全面には使わない。

media.ioで生成したウィンターオーラムの画像例

9) ミュージアムベルベット

HEX： #081a2c #133e7c #2e6bd1 #b9912f #e9e2d6

雰囲気： クラシック、教養、高級感

おすすめ用途： 展覧会ポスターと美術館ブランディング

クラシックで教養ある雰囲気は、ベルベットロープやスポットライトを浴びる額縁、金色のプレートを思い出させます。深いネイビーが長文コピーを支え、明るいブルーがルックを現代的にします。暖かみのある紙の質感やエレガントなセリフ体の見出しと組み合わせることで、アーカイブの趣が生まれます。使用のコツ：ゴールドは小さな封印やロゴスタンプとして使い、威厳を示しましょう。

media.ioで生成した美術館ベルベットの画像例

10) サンリット・デルフト

HEX： #0d2b52 #1f5fa8 #8fc2ea #e0b84a #fff7e6

雰囲気： 明るく、職人風、暖かい

おすすめ用途：陶器店ブランディングとEコマースバナー

陽気で職人らしさがあり、温かみのある太陽に照らされたデルフトブルーを思い出させます。クリーミーな背景が商品ページを明るく、歓迎ムードに仕上げます。手描きのパターンやさりげないグレインと組み合わせて工芸の信頼感を高めましょう。使用のコツ：ゴールドのコールトゥアクションをネイビーに配置すると最大限の読みやすさになります。

media.ioで生成したサンリット・デルフトの画像例

11) オーロラ・トロフィー

HEX： #07162a #144b8a #46b3ff #ffd166 #f1f6ff

雰囲気： 力強く、エネルギッシュ、モダン

おすすめ用途： ゲーム大会ランディングページ

力強くエネルギッシュで、ネオンブルーの軌跡と暖かいトロフィーの輝きを感じさせます。このコントラストはヒーローセクションやカウントダウン、競技ランキング表に最適です。ダークグラデーションやシャープなディスプレイ書体と組み合わせて高いインパクトを出しましょう。使用のコツ：ゴールドは勝者や主要アクションだけに使い、階層を保ちます。

media.ioで生成したオーロラ・トロフィー画像例

12) ブループリント・ブラス

HEX： #0a1c33 #173e75 #2b6cb0 #c49b3a #dfe7f2

雰囲気： 実用的、工学的、信頼できる

おすすめ用途： 建築ポートフォリオと提案デッキ

実用的で工学的な雰囲気は、図面のインクや真鍮の定規の縁を思わせます。ミッドブルーが図を読みやすくし、ゴールドがプレミアムなハイライトを加えます。細いラインアイコンや十分な余白、クールなグレーと組み合わせて構造を整えましょう。使用のコツ：ゴールドは注目の数字や重要な寸法だけに使い、視線を誘導します。

media.ioで生成したブループリント・ブラス画像例

13) オパール・コンパス

HEX： #0c2440 #165c96 #a7d8f5 #d7b75a #f8f4ec

雰囲気： 穏やか、空気感、洗練された

おすすめ用途： ウェルネスブランドとスパパンフレット

穏やかで空気感があり、淡い海の地平線や柔らかなオパールの光を思わせます。優しいブルーが癒しを感じさせ、暖かいゴールドが冷たくなりすぎないようにしています。ミニマルな写真、多くの空白、軽やかなセリフ体見出しと組み合わせてください。使用のコツ：最も淡いブルーは広い面積に、ネイビーは本文に使いましょう。

media.ioで生成したオパール・コンパス画像例

14) ジャズ・エイジ・ヨット

HEX： #071a33 #0f3d7a #2a7bd6 #b38728 #f4ead6

雰囲気： ヴィンテージ、贅沢、生き生きとした

おすすめ用途： ガラパーティ招待状と基金イベント資料

ヴィンテージ感と生き生きした雰囲気は、真夜中の水面で響くジャズやブラスノートを思わせます。ゴールドは控えめに使うことで華美にならずフォーマルに映ります。クリーム色の紙、モノラインアイコン、クラシックセリフ体で名前や日付を書くと効果的。使用のコツ：ゴールドはネイビーに箔押しして最もドラマチックな印象を。

media.ioで生成したジャズ・エイジ・ヨット画像例

15) ランタンド・ラグーン

HEX： #06243a #0b6b8f #4fc3f7 #f4c95d #f6fbff

雰囲気： トロピカル、遊び心、明るい

おすすめ用途： 夏祭りポスターとSNSタイル

トロピカルで遊び心があり、明るいラグーンの上で灯るランタンを連想させます。ティール系ブルーが新鮮さを演出し、ゴールドが夜の温かみをもたらします。エネルギッシュな形や大胆な見出しと組み合わせ、白を多用して柔らかくしましょう。使用のコツ：最も明るいシアンは小さなアクセントだけに使い、ゴールドが目立たなくならないように。

media.ioで生成したランタンド・ラグーン画像例

16) アルパイン・クレスト

HEX： #071b2e #1e3a8a #6aa9ff #d4b052 #eef2f7

雰囲気： きりっと、自信があり、アウトドア風

おすすめ用途： アウトドア用品広告

きりっと自信ある雰囲気は、晴れたアルプスの朝や陽光に輝く頂上を思い起こさせます。ブルーがパフォーマンス訴求を支え、ゴールドが温かみと高級感を与えます。シャープな製品写真や最小限のコピー、強いグリッドと組み合わせてください。使用のコツ：見出しにはネイビーを、ゴールドは重さや耐久性など仕様のハイライトに。

media.ioで生成したアルパイン・クレスト画像例

17) ノーブル・アトラス

HEX： #091a2a #12305f #2f6fb2 #caa54a #f2efe7

雰囲気： 学問的、安定した、伝統的

おすすめ用途： 書籍カバーと学会資料

学問的で安定感があり、経年で擦れたゴールドのスタンピングのあるアトラスカバーをイメージさせます。構造的なブルーが長いタイトルやスケジュールを読みやすくします。紙質の背景やクラシックセリフ体と組み合わせて権威ある印象に。使用のコツ：最も明るいニュートラルは余白に、ゴールドはタイトルスタンプやエンブレムに限定。

media.ioで生成したノーブル・アトラス画像例

18) ゴールデン・ネビュラ

HEX： #050b1a #14213d #2d6cdf #f7c948 #e5e7eb

雰囲気： 宇宙的、劇的、未来的

おすすめ用途： 音楽アルバムアートワークとストリーミングカバー

宇宙的で劇的な雰囲気は、電気ブルーの空間を切り裂くゴールドのフレアが印象的です。深いベースが鮮やかなアクセントを映画的かつモダンに演出します。高コントラストの書体や抽象的グラデーションと組み合わせて未来感を強調。使用のコツ：ゴールドはアーティスト名の後ろに小さな輝きとして使い、背景全体にはしません。

media.ioで生成したゴールデン・ネビュラ画像例

19) ヘリテージ・ポーセリン

HEX： #0b2a4a #1b5ea8 #b9dcff #d8b04c #fffdf7

雰囲気： 時代を超えて清潔感、ブティック風

おすすめ用途： 文房具セットと個人モノグラム

時代を超えた清潔感は青い磁器と繊細なゴールド縁取りを思わせます。優しいコントラストで、モノグラムや枠が印刷でも鮮明に映ります。さりげないパターンやコットンペーパー、シンプルなセリフ体イニシャルと組み合わせてください。使用のコツ：淡いブルーは封筒のライナーに、ゴールドはモノグラムマークにだけ使いましょう。

media.ioで生成したヘリテージ・ポーセリン画像例

20) スカイライン・ブリオン

HEX： #061225 #0f3b78 #2f80ed #d1a93b #f5f7fa

雰囲気： 都会的、シャープ、高級感

おすすめ用途： 不動産ランディングページと物件リスト資料

都会的かつシャープな印象は、ガラス張りのブルーのスカイラインと金のアクセントを思わせます。高級感あるゴールド×ブルーの組み合わせなら、レイアウトはクリーンかつ構造的に。モダンなサンセリフ見出しやグレーのサポート詳細と合わせましょう。使用のコツ：ゴールドは価格タグや重要な数値に、ブルーはナビやセクションに。

media.ioで生成したスカイライン・ブリオン画像例

21) クラウンライン・エディトリアル

HEX： #0a1930 #173f7a #4b9ae8 #c7a241 #f2f2ee

雰囲気： 編集的、エレガント、端正

おすすめ用途： 雑誌誌面やルックブック

編集的で端正な雰囲気は、緻密なネイビーインクとさりげなく記されたゴールドサインのようです。バランスが良く、見出しや引用、商品コールアウトを写真を邪魔せず引き立てます。暖かいニュートラルや控えめなアクセント形状と組み合わせたプレミアムなレイアウトに。使用のコツ：ゴールドは小さなマーカーやフォリオにだけ、ページが軽やかに保てます。

media.ioで生成したクラウンライン・エディトリアル画像例

22) マリナー・エンブレム

HEX： #081c34 #114b8b #3f8bd6 #e3b23c #f9f6ef

雰囲気： 力強く、クラシック、エンブレム風

おすすめ用途： スポーツクラブロゴとバッジシステム

力強くクラシックな雰囲気は、縫い付けパッチや真鍮ボタン、清潔なユニフォームブルーを連想させます。ゴールド×ブルーのカラーパレットは、クレストや盾、権威が必要なアイデンティティマークに特に効果的。白でクリアに、黒を少し加えてインパクトを。使用のコツ：バッジはまずネイビーで作り、ゴールドはアウトラインやハイライトに。

media.ioで生成したマリナー・エンブレム画像例

ゴールド×ブルーに合う色は？

アイボリーやクリーム、砂色などの暖かいニュートラルは、ゴールドとブルーのコントラストを柔らかくし、パレットをより高級で印刷向きに仕上げます。ゴールドアクセントも派手ではなく意図的に見せることができます。

スレートグレーやシルバー、淡いブルーグレーなどクールな補助トーンは、レイアウトをクリーンかつテック感ある印象に。ダッシュボードや編集用グリッドで特に活躍します。ブルーが主背景の場合にぴったりです。

さらに奥行きを出すなら、タイプやアウトライン用に限りなくブラックに近いチャコール、あるいはティール系のアクセントを加えると、ゴールド×ブルーの調和を崩さずフレッシュな沿岸風になります。

ゴールド×ブルーパレットを実際のデザインでどう使う？

まず役割を決めましょう：ネイビー・ディープブルーは主背景や書体に、ミッド・明るいブルーはインタラクティブやハイライトに、ゴールドはボタンやバッジ、重要数字など「注目すべき瞬間」に使います。

ゴールドの面積は低く（レイアウトの5～10%程度）保つことで高級感を維持できます。より強調したい場合は、ゴールドのブロックを増やすのではなく、明るいニュートラルでコントラストを高めましょう。

印刷の場合、ゴールドはフラット（HEX）またはグラデーションで表現できます。最も高級感のある仕上がりには箔押しや特色印刷が検討できます。UIでは、ゴールドを長いテキストには使わず、アイコンや小さなラベルなどに限定してください。

AIでゴールド×ブルーパレットをビジュアル化する

実際のレイアウトでゴールドとブルーのカラースキームをプレビューしたい場合は、上記のようなAIプロンプトを使って簡単なモックアップを作成しましょう。これにより、ムードやコントラスト、階層を迅速にテストし、デザイン方針を決める前に確認できます。

背景（ネイビーまたはオフホワイト）を入れ替えたり、ゴールドを使う場所（CTAのみやセクション見出しなど）を変えてバリエーションを試してみてください。ちょっとした違いで、同じ配色でも「ラグジュアリー」や「スポーティ」といった印象が大きく変わります。

気に入った方向性が見つかったら、そのプロンプト構造をバナー、ポスター、パッケージ、UI画面などさまざまな用途で使い回すことで、ビジュアル言語の一貫性を保てます。

次へ： ティールグレー配色