おしゃれなゴシックカラーパレット20選と配色のコツ【HEXコード付】

ゴシックなパレットは、深い影とロマンチックなハイライトを融合させることで、映画のようでエレガント、そして少しミステリアスなデザインを生み出します。派手なネオンのようなエネルギーを避けつつ、高いコントラストを求めるときに最適です。

以下に、HEXコード付きの20種類以上のゴシックカラーパレットアイデアと、ブランド、UI、ポスター、招待状、ムーディな写真編集への応用ポイントを紹介します。

ゴシックパレットがこれほど魅力的な理由

ゴシックなカラーパレットは、意図的な暗さを中心に構成されます。ほぼ黒に近いベース色、深い宝石色、そしてやわらかなハイライト。こうした構成が自然に階層を作り出し、タイポグラフィや注目要素を、少ない手間でよりドラマチックに演出します。

ゴシックパレットは感情も素早く伝えます――たとえばロマンス、ミステリー、伝統、力など、バーガンディやバイオレット、スレートブルー、アンティークゴールドに寄せるかで表情が変わります。最小限のレイアウトでも、影が物語を語るため映画的な雰囲気を醸し出します。

最も重要なポイントとして、ゴシックな配色は様々なメディアで柔軟に使えます。同じパレットが、ラグジュアリーブランドのアイデンティティ、ダークモードUI、ポスター、写真プリセットなどに適用可能です。コントラストを調整し、アクセントの使い過ぎを避けることがポイントです。

20種類以上のゴシックカラーパレット（HEXコード付き）

1）カテドラルベルベット

HEX： #0b0b0f #2a2438 #5a1f2b #a28b6e #e7e1d6

雰囲気： ダーク＆ロマンティック、荘厳、キャンドルの灯りのよう

おすすめ用途： ラグジュアリーブランドやロゴシステム

ダークベルベットの影とチャペルのキャンドルライトが、柔らかなアンティークな輝きとともに荘厳でロマンティックな雰囲気を醸し出します。ほぼ黒と深いプラムをメインに、バーガンディをアクセントとして加えることで派手になりすぎません。温かみのあるゴールドベージュやボーンホワイトは、タイポグラフィに雑誌のような高級感を演出します。洗練されたゴシックパレットに仕上げるには、アクセントは10%未満に抑えホワイトスペースを活用しましょう。

media.ioを利用して生成したカテドラルベルベットの画像例

Media.io

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

無料で今すぐ試す

2）ミッドナイトローズ

HEX： #120a14 #3b1c32 #7a1e3a #c24a6a #f2d7de

雰囲気： ロマンティック、ドラマティック、現代的ヴィンテージ

おすすめ用途： ビューティー商品の広告やSNS投稿

ミッドナイトの花柄や砕けたローズペタルが、劇的で親密な輝きを与えます。インクのようなベースでレイアウトを固定し、ワインやラズベリー系のトーンを重ねてグラデーションやオーバーレイで奥行きを演出。淡いブラッシュカラーが肌色を美しく見せ、重たくなりすぎません。明るいピンクはコールトゥアクションボタンや価格タグに控えめに使いましょう。

media.ioを利用して生成したミッドナイトローズの画像例

3）アイアン＆インク

HEX： #0f141a #27313a #4b5a6a #9aa6b2 #f0f3f6

雰囲気： インダストリアル、クリーン、夜のような雰囲気

おすすめ用途： ダッシュボードUIやデータ中心のアプリ

冷たいスチール、インクの染み、雨の夜の反射が、無機的でテクニカルなムードを生み出します。スレートやチャコールでダークモードの土台を作り、ミッドブルーでチャートを見やすくします。淡いミストカラーはカードや仕切り、データの欠損部分に使いコントラストを強調。最も明るい色を重要な数字や合計値に限定すると視認性が高まります。

media.ioを利用して生成したアイアン＆インクの画像例

4）レイヴングリーンハウス

HEX： #050806 #0f2a1f #214f3b #6d8f6a #dfe7d6

雰囲気： ミステリアス、ボタニカル、アーシー

おすすめ用途： 調剤パッケージやラベル

影のある葉や湿ったガラスが、植物的で秘密の庭のような雰囲気をもたらします。ほぼ黒のメイントーンに深いグリーンを使い、モス色は封印やセカンドブロックに利用。淡いハーバルカラーは成分表示やバーコード部分に最適です。緑系はマットに仕上げ、ネオン風にならないよう自然な質感を活かしましょう。

media.ioを利用して生成したレイヴングリーンハウスの画像例

5）オブシディアンアメジスト

HEX： #0a0710 #241338 #4b1f6f #7c49b9 #e9ddff

雰囲気： 神秘的、ラグジュアリー、夜空

おすすめ用途： 音楽ポスターやアルバムアート

オブシディアンの闇とアメジストの輝きが、霧の中から差すステージライトのような印象を与えます。もっとも深い2色のパープルで階層を作り、バイオレットやラベンダーでタイトルや重要な要素を引き立てます。淡いライラックは、ダーク背景でも小さな文字が読みやすく、白浮きしません。微細なグレインや滑らかなグラデーションを加えて高級感を出しましょう。

media.ioを利用して生成したオブシディアンアメジストの画像例

6）セパルカーゴールド

HEX： #0c0b09 #2b2216 #5c4526 #b08a3c #f2e6c7

雰囲気： アンティーク、豪華、キャンドルライト

おすすめ用途： プレミアムパッケージ＆ギフトボックス

時を経たメタルと温かいキャンドルの光が、まるで美術館のような重厚感をもたらします。ダークブラウンでパネルや影を作り、ゴールドは枠線やアイコン、箔押し演出に限定。パーチメントカラーで可読性と高級感を演出します。ゴールドは細いラインやポイント使いにとどめるとゴシックパレットらしくなります。

media.ioを利用して生成したセパルカーゴールドの画像例

7）ストームチャペル

HEX： #0d1016 #1e2a3a #334b63 #6f8aa3 #d9e2ec

雰囲気： 重厚、クール、映画的

おすすめ用途： サイトのヒーローセクションやLP

雷雲のブルーと冷たい石の影が映像的で集中感を与えます。最もダークな色はヘッダーやナビに、ミッドブルーはボタン・リンク・グラフ線に使用するとバランス良し。淡いブルーグレーはムーディーな雰囲気を保ちつつ、すっきりしたページ背景になります。ポイント：見出しの背後にわずかなビネットを追加すると、コントラストが強調されつつきつすぎる印象になりません。

media.ioを利用して生成したストームチャペルの画像例

8）クリムゾンカンデラブラ

HEX： #140507 #3a0b12 #6b101c #b21c33 #f4c7cf

雰囲気： 劇的、シアトリカル、情熱的

おすすめ用途： イベントフライヤーやナイトクラブポスター

深い影に浮かぶホットクリムゾンは、ベルベットの部屋で灯るキャンドルのよう。最も暗い2色は背景やテキストブロックに使用し、より明るいクリムゾンで見出しや開催日などを強調。淡いブラッシュは、著作権表示やQRコード欄に最適。しっかり余白をとり、激情を意図的に見せ、散漫な印象にしないのがコツです。

media.ioを利用して生成したクリムゾンカンデラブラの画像例

9）月夜のレース

HEX： #0e0e12 #3b3b44 #7f7f8a #c8c8d0 #f7f6fa

雰囲気：柔らかく、エレガント、夜行性

おすすめ用途：結婚式の招待状と文房具

レースの月明かりは柔らかくエレガントで、静かなゴシックなエッジを持っています。タイポグラフィとモノグラムのために、ほぼ黒と温かみのあるグレーバイオレットを組み合わせてください。明るいグレーは、繊細なパターンやエンボスのようなディテールの余地を与えます。モダンなゴシックの色の組み合わせには、花柄やレースのモチーフを微妙に保ち、最も淡い色合いを紙のベースとして使用してください。

media.ioを使って生成したムーンライトレースの画像例

10) アンティークブラッドストーン

HEX：#0f0b0a #3a1f1a #6b3a2a #a05a3d #e6d3c7

雰囲気：ヘリテージ、暖かい、影のある

おすすめ用途：コーヒーブランディングとヴィンテージラベル

焦げたシエナとダークココアの色調は、古い革、ステンドペーパー、暖かいランプライトを思い起こさせます。最も深い茶色をベースにして、ラベルパネルやスタンプのために錆と粘土の色合いを重ねます。薄いパーチメントカラーで読みやすさが向上し、パレットが濁るのを防ぎます。ヒント: セリフ書体と最小限のアイコノグラフィーを組み合わせると、クラシックな外観になります。

media.ioを使って生成したアンティークブラッドストーンの画像例

11) 毒ティール

HEX：#060c0f #0e2a33 #0f5664 #3aa0a8

雰囲気：謎めいた、モダン、ハイコントラスト

おすすめ用途：テクノロジースタートアップのUIとSaaSブランディング

シャープなティールグローを持つ深海の影は、モダンで少し危険な感じがします。ナビゲーションとフッターには最も暗いトーンを使用し、インタラクティブな状態とリンクには飽和ティールを適用します。淡いアクアの色合いは、通知やツールチップのハイライト背景として機能します。ヒント: 透明感と一貫性を維持するために、ティールを 1 つのアクセント カラーにしてください。

media.ioを使って生成したポイズンドティールの画像例

12) 地下室ラン

HEX：#120711 #3a1733 #6d2b60 #b04a9c #f6d7f0

雰囲気：神秘的、花柄、退廃的

おすすめ用途：編集レイアウトとファッションルックブック

蘭の紫とスモーキーな梅の色調は、薄暗い廊下の香りの空気のように退廃的な感じがします。列とキャプションには最も暗い色合いを使用し、引用符とセクション ヘッダーにはマゼンタ オーキッドをポップにします。柔らかいピンクのハイライトは、スプレッドを読みやすくし、重い画像のバランスをとります。このゴシック カラー パレットは、多くのネガティブ スペースと抑制されたグリッドで最もよく機能します。

media.ioを使って生成した地下ランの画像例

13) 煤とサファイア

HEX：#070a10 #0f1d38 #1f3b6f #3f6db3 #d6e5ff

雰囲気：夕暮れ、さわやか、明るい

おすすめ用途：ブックカバーとポッドキャストのアートワーク

すすのようなブルーと明るいサファイアのハイライトは、夜の空気と遠くの街の明かりを示唆しています。背景には最も暗いネイビーを使用し、図形とフレームにはミッドブルーで深さを構築します。氷のような色合いで、タイトルやエピソード番号を強調することができ、厳しい感じを感じることはありません。ヒント: 暗いグラデーションのバンディングを防ぐために、タイプの後ろに微妙なテクスチャを追加します。

media.ioを使って生成したスートとサファイアの画像例

14) 魔女のヘーゼルの煙

HEX：#0b0d0c #1f2421 #3e4a45 #7b8a82 #e3e8e5

雰囲気：ハーブ、ミュート、雰囲気

おすすめ用途：スキンケアパッケージと成分シート

スモーキーなグリーンと柔らかいアッシュトーンは、落ち着いてハーブ的で、少し神秘的な感じがします。ブランドマークと成分の見出しは最も暗い色合いにし、セカンダリパネルにはミッドグリーングレーを使用します。淡い霧は、まだムーディーを読むきれいな背景として機能します。ヒント: 細いラインのアイコンとマット仕上げを組み合わせると、すべてが控えめになります。

media.ioを使って生成したウィッチヘーゼルの煙の画像例

15) ガーゴイル石

HEX：#0c0c0d #2a2b2e #50525a #8b8f9a #e8e9ee

雰囲気：建築的、最小限、厳しい

おすすめ用途：ポートフォリオサイトとタイポグラフィに焦点を当てたページ

彫刻された石と曇り空は、このパレットにシャープで建築的な落ち着きを与えます。ブラックとチャコールを使用してタイポグラフィのコントラストを強くし、ディバイダーとUIボーダーにはミディアムグレーを使用します。クールなライトグレーは、長い形式のコンテンツのための優れた読書背景を作ります。ヒント: 大胆なタイプのウェイトを 1 つ追加し、間隔を空けてドラマを運びましょう。

media.ioを使って生成したガーゴイル石の画像例

16) ブラックチェリービニール

HEX：#120006 #3c0013 #6b0026 #b1003f #ffd1e0

雰囲気：大胆な、光沢のある、ナイトライフ

おすすめ用途：ストリートウェアのドロップと製品プロモーション

光沢のあるブラックチェリートーンは、真夜中以降にビニールの光沢とネオンの反射のように感じられます。背景とタイプには最も暗い色合いを使用し、バッジや限定ドロップラベルにホットチェリーレッドをパンチします。柔らかいピンクのハイライトは、オーバーレイやグラデーションのエッジを柔らかくすることができます。これらのゴシック色の組み合わせは、タイトでコントラストの高いレイアウトや大きなタイプに最もよく合います。

media.ioを使って生成したブラックチェリービニールの画像例

17) ベルベット オリーブ ダスク

HEX：#0b0c07 #23260f #4a4f1e #7b842f #e6e8c7

雰囲気：土のような、静かな、夕暮れの森

おすすめ用途：インテリアムードボードやライフスタイルブログ

鬱蒼とした森の中の夕暮れは、静かなオリーブの暖かさで、地に足のついた親密な感じがします。ヘッダーとフレームにはダーク オリーブ ブラックを使用し、スウォッチ、アイコン、ハイライトにはミッド オリーブを重ねます。淡いクリーム色のグリーンは、テキストエリアやカードに息抜きの余地をもたらします。ヒント: 木の質感と暖かいニュートラルと組み合わせると、居心地の良い住み込みの外観になります。

media.ioを使って生成したvelvet olive duskの画像例

18) 秘密の铜

HEX：#0e0906 #2f1a12 #6a3a28 #b06a43 #f2d6c7

雰囲気：暖かい, 錬金術, 職人

おすすめ用途：キャンドルラベル・手作り雑貨

くすぶる銅と濃いスパイスの色調は、古い道具、ワックスシール、錬金術師のワークショップを思い起こさせます。ラベルとタイポグラフィにはエスプレッソベースを使用し、エッジ、アイコン、小さなアクセントに銅を置きます。淡い桃色のクリームは、成分のテキストを清潔で読みやすく保ちます。ヒント: 微妙なエンボス加工効果を試して、銅のハイライトを薄くしてリアルにしてください。

media.ioを使って生成したアーケーン銅の画像例

19) 冬の喪

HEX：#0a0d12 #1b2430 #3c4b5c #8b9ab0 #edf1f6

雰囲気：静かで、冷たく、厳粛で

おすすめ用途：写真プリセットとギャラリーウェブサイト

暗い水の上に冷たい空気と淡い日光が静かで厳粛な雰囲気を作り出します。フレームとナビゲーションには最も深いブルーを使用し、キャプションと微妙なUIラインにはミッドスレートを適用します。淡いグレーブルーは、競合せずに画像のためのきれいなキャンバスとして機能することができます。ヒント: ミュートされたトーンに合わせて、写真全体の彩度を低く保ちます。

media.ioを使って生成した冬の喪中の画像例

20) レリックアイボリー

HEX：#100f0c #2b2a22 #5b5748 #b8b09a #fbf5e9

雰囲気：アーカイブ, ソフト, オールドワールド

おすすめ用途：本のタイポグラフィと文房具セット

古い羊皮紙と柔らかい影は、このミックスにアーカイブ、図書館の雰囲気を与えます。本文のテキストと見出しには濃いインクトーンを使用し、暖かいトープでフレームとサイドバーを形作ります。クリーミーなアイボリーは、まだアンティーク感のある紙のようなベースとして機能します。バランスの取れたゴシックな色の組み合わせのために、コントラストを穏やかに保ち、彩度よりも質感を優先します。

media.ioを使って生成したレリックアイボリーの画像例

21) ノワールプラムアッシュ

HEX：#0b0a0d #221824 #4a2a4f #8a6c92 #f0e8f2

雰囲気：スモーキー、親密、洗練された

おすすめ用途：化粧品ランディングページとメールヘッダー

スモーキープラムと柔らかいアッシュラベンダーは、パウダーシャドウとサテン生地のように親密な感じがします。ヘッダーとフッターにはノワールベースを使用し、ボタンとリンク状態にはプラムを適用します。ミュートされたモーブグレーは、カードやセクションの微妙な背景をサポートします。ヒント: レイアウトを圧倒することなく、光沢のあるハイライト効果を 1 つ追加して、プレミアムな美容エネルギーを実現します。

media.ioを使って生成したノワール梅灰の画像例

22) とげベリー

HEX：#0f0407 #3a0f1c #6b1e33 #a93a55 #f3c9d3

雰囲気：ロマンチック、シャープ、ストーリーブック

おすすめ用途：バレンタインのプロモーションとロマンチックなポスター

とげのあるベリーと濃い花びらは、赤をロマンチックに感じさせますが、甘くはありません。黒くなったベースを使用してネガティブなスペースと深さを作成し、焦点領域としてワインからベリーまでのグラデーションを作成します。柔らかいチークは、細かいプリントや繊細なライン アートに最適です。ヒント: 手描きのボタニカル アクセントと組み合わせて、見出しを大きくシンプルに保ちます。

media.ioを使って生成したとげベリーの画像例

23) 呪われたエメラルドインク

HEX：#060907 #0e1f17 #124136 #1f7a63 #d5efe6

雰囲気：ミステリアス、ジュエル調、フレッシュダーク

おすすめ用途：ゲームUIとストリーマーオーバーレイ

漆黒に近い背景に映える宝石のようなエメラルドは、まるで暗い部屋で魔法の光が輝くよう。最も深い2色の緑はパネルやオーバーレイに使用し、明るいエメラルドでインタラクティブ要素やアラートを示しましょう。淡いミント色は、ラベルやタイマーの読みやすいハイライトとして機能します。ポイント：グロー効果は柔らかく統一感を持たせ、インターフェース全体の鮮明さを保ちましょう。

media.ioで生成した呪われたエメラルドインクの画像例

ゴシックに合う色は？

ゴシックな配色には、漆黒に近い中性色（チャコール、インク、煤）と、バーガンディ、アメジスト、エメラルド、深いティールなどの鮮やかな「ストーリー」カラーを1～2色加えるのが最適です。こうすることで、ドラマティックな雰囲気を保ちつつ、しっかりデザインされた意図を感じさせます。

ハイライトには純白ではなく、柔らかなライトカラー（羊皮紙、骨、ブラッシュ、ミストブルー、アンティークアイボリー）を選びましょう。これらはタイポグラフィの可読性を保ちつつ、ゴシックらしいムードを演出します。

現代的なコントラストを加えたい場合は、クールなスチールブルー、くすんだラベンダー、アンティークゴールドなどで薄い線や小さなボタンなどの控えめなアクセントを追加します。ポイントは節度――ゴシックの魅力は影の存在感にあります。

実際のデザインでゴシックカラーパレットを使うコツ

背景やヘッダーには暗いベースカラーを使い、表面（カード、パネル、ブロック）には中間色、インタラクション（リンク、CTAボタン、プライスタグ）にはアクセントカラーを割り当てます。この「ベース／サーフェス／アクセント」構造により、ダークなデザインがのっぺりするのを防ぎます。

読みやすさのためには、明るい色調を戦略的に使いましょう：最も明るい色は見出しや重要な数字、メインテキストに使用し、副次的なテキストはそれよりやや暗めに。印刷物では、より上質で編集的な雰囲気を出すために暖かみのあるオフホワイト（アイボリーや羊皮紙）を選んでください。

写真やポスターには、ゴシックな配色がなめらかなグラデーションと微細な粒子感、柔らかなビネット効果で映えます。強い輪郭線の代わりに、明暗さ（明るさと暗さ）の差を活かしたコントラストを取り入れましょう。彩度の強い色使いは控えめに。

AIでゴシックパレットのビジュアルを作成する

ムードボードや広告モックアップ、UIコンセプト、ポスターを作る際は、パレットに合わせたビジュアルをいくつか生成すると、雰囲気の確認が素早くできます。アクセントカラーがロマンチック、陰鬱、または明るすぎるかどうか、すぐに判断できるでしょう。

Media.ioのテキストから画像生成ツールを使えば、プロンプトを貼り付けて構図を指定し、ゴシックパレットを維持しながらバリエーションを繰り返し作成できます。これは特にブランド検討やキャンペーンアイデアの探索時に便利です。

同じパレットで商品写真・ポスター・UIモックアップ等の画像セットを作成し、さまざまな状況やライティングでカラーがどう見えるかを確認しましょう。

次へ： コーラルカラーパレット