火山カラーパレット20選｜HEXコード＆AIデザイン例付き

火山のカラーパレットは、煙のようなチャコール、溶岩の赤、灰色ニュートラルをブレンドし、力強く、安定感があり、現代的な雰囲気を醸し出します。

ダークモードUI、大胆なパッケージ、映画のポスターなどをデザインする際、すぐに使える20種類の火山パレットにはHEXコードと再利用可能なAI画像プロンプトが付属しています。

なぜ火山パレットはこんなに効果的なのか

火山パレットは自然のコントラストに基づいています：ほぼ黒の岩や灰の隣に暖かいエンバーの赤や銅色のブラウン、砂のようなハイライトが並び、そのバランスによってドラマチックさを保ちつつ、混乱を感じさせません。

媒体を問わず柔軟に活用できます。ダークなベースはUIやエディトリアルレイアウトで階層を作り、暖かいアクセントはパッケージ、ポスター、SNSグラフィックで強いアクションを引き立てます。

多くの火山カラーはネオンではなく落ち着いた色調のため、写真や印刷によく合います。上質で質感のある見た目を保ちながら、文字の読みやすさや清潔なスペースを維持できます。

20以上の火山カラーパレットアイデア（HEXコード付き）

1）ラバダスク

HEX： #1b1b1e #3a2b2f #7b2d26 #d45b3a #f2c6a0

雰囲気： ドラマチック・シネマティック

おすすめ用途： 映画のポスターやキーアート

ドラマチックでシネマティックなミックスは、煙たい夕日の下で冷えゆく溶岩のような印象です。ほぼ黒や深いマルーンはタイポグラフィや影の背景に使い、エンバーオレンジは注目要素へ。ソフトサンドトーンが肌やハイライトの濁りを防ぎます。マットな質感と大胆なタイトルフォントで最大のインパクトを。

media.ioで生成されたラバダスクの画像例

Media.io

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

今すぐ無料で試す

2）バサルトブルーム

HEX： #2b2d2f #4a4f52 #6b5c4d #a58b6f #d9c7b6

雰囲気：安定感・モダン

おすすめ用途：ミニマルなブランドアイデンティティ

安定感とモダンさがあり、玄武岩や使い込んだレザー、柔らかなスタジオライトを思わせます。クールなグレーはレイアウトやグリッドに、タンやサンドで親しみやすさをプラス。このセットはクラフトやスタジオ、控えめなライフスタイルブランドにぴったり。最も明るい色を余白やマージンに使ってコントラストを際立たせましょう。

media.ioで生成されたバサルトブルームの画像例

3）アッシュングロー

HEX： #0f1112 #2f3235 #6e5d52 #c97b4a #f3e2cf

雰囲気：スリーク・高コントラスト

おすすめ用途：ダークモードUI

スリークで高コントラスト、遠火に照らされた灰の雲のイメージです。最も暗い2色はサーフェスやナビゲーションに、クリーム色は主要テキストやカード背景に。温かい粘土色やエンバー色はボタンやバッジ、アクティブ状態に最適。アクセントは画面ごとに1つだけで視覚ノイズを防ぎましょう。

media.ioで生成されたアッシュングローの画像例

4）クレータークレイ

HEX： #2a1f1b #5a3b2e #9a5a3a #c9865c #f0d8c4

雰囲気：アース感・手作り感

おすすめ用途：陶芸スタジオのWebサイト

アース感と手作り感があふれ、窯焼きの粘土、使い込んだエプロン、暖かな工房の灯りを感じさせます。ヘッダーやフッターには深いブラウン、CTAやハイライトにはテラコッタやシエナを。淡いセラミック色は軽やかなセクションや商品グリッドに最適。中間色をよりリアルに見せるため、微粒子や紙の質感を加えるのがおすすめです。

media.ioで生成されたクレータークレイの画像例

5）エンバーストーン

HEX： #1a1412 #4a2a1f #8b3a2a #c24f33 #ffb27a

雰囲気：大胆・スパイシー

おすすめ用途：ホットソースパッケージ

大胆でスパイシー、燃える炭や焦げた木、明るい熱のキックを連想させます。火山色の組み合わせは、ラベルのインスタントな棚のインパクトに最適で特にオレンジはキャップやシール、フレーバーマーカーに映えます。明るいピーチ色を背景パネルとして余白に使い、強い色のバランスを保ちましょう。アクセントにだけスポットグロスを使うことで、デザインを圧倒せず際立たせます。

media.ioで生成されたエンバーストーンの画像例

6）サルファーミスト

HEX： #2a2b26 #5e5c4b #a7a37c #d6cc8a #f2f0dc

雰囲気：落ち着き・鉱石感

おすすめ用途：ウェルネスアプリのオンボーディング

落ち着きと鉱石感があり、蒸気の噴気孔や柔らかな苔、霧の朝の光をイメージ。クリームや淡い硫黄色はウェルカム画面に、ナビゲーションには深いオリーブチャコールを。くすんだ黄色は進行状況やさりげないハイライトに最適でネオン感はありません。イラストはシンプルなラインベースがおすすめ。

media.ioで生成されたサルファーミストの画像例

7）オブシディアンナイト

HEX： #050607 #1a1d1f #2f3438 #6a4a3c #c9a38c

雰囲気：高級感・夜間

おすすめ用途：高級腕時計広告

高級感と夜間の雰囲気で、磨かれた黒曜石と暖かいブロンズの輝きをイメージします。ブラックとグラファイトトーンをフレームに多用し上品な印象へ、ブロンズブラウンは洗練されたアクセントに。ソフトベージュのハイライトは小さな文字や反射、微妙なグラデーションに最適。背景をほぼ単色に保つことで高級でミニマルな雰囲気を維持できます。

media.ioで生成されたオブシディアンナイトの画像例

8）パミスサンド

HEX： #2e2a26 #6b625c #a79f97 #d6d0c8 #f7f4ef

雰囲気：ソフト・ニュートラル

おすすめ用途：インテリアデザインムードボード

ソフトでニュートラル、軽石やリネン、陽の差す漆喰壁を思わせます。マテリアルや質感が主役のムードボードにぴったり。ダークブラウングレーは見出しやサンプルに、最も明るい色はレイアウトのエアリーでスペーシーな側面に。色よりも質感（コンクリート、布、木）で変化を付けるのがおすすめです。

media.ioで生成されたパミスサンドの画像例

9）マグマローズ

HEX： #241317 #4a1f2c #7d2d3f #c75a5a #f1c7ba

雰囲気：ロマンティック・強烈

おすすめ用途：ビューティブランドのSNS投稿

ロマンティックで強烈、溶融したローズ顔料がベルベットの影へと冷めていくよう。ビューティ系火山パレットとしては、広い色面や商品のシルエットを使ったレイアウトが最適。見出しのソフト化にはブラッシュトーン、コントラストや高級感には深いプラムがおすすめ。グラデーションは2段階までに制限するとレッドが濁らずリッチさが保てます。

media.ioを使って生成したマグマローズの画像例

10) シンダー铜

HEX：#1e1510 #4b2b1b #7b4a2d #b36b3f #e6c2a1

雰囲気：暖かく素朴な

おすすめ用途：コーヒーパッケージ

暖かく素朴なこれらの色調は、ロースト豆、銅のやかん、トーストした砂糖を示唆しています。大胆なブランドブロックには深いエスプレッソシェード、パターンやオリジンスタンプには銅のミッドトーンを使用してください。淡いクレマの色合いは、テイスティングノートやバーコード領域のためのきれいな背景になります。ヒント: 新しい色を追加せずに、暖かいハイライトを反映するために、銅箔要素を 1 つ追加します。

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

11) 火山セージ

HEX：#1f1f1b #3a3f35 #6a6f56 #a9ad7d #e2e4cf

雰囲気：自然で回復的な

おすすめ用途：エコリゾートパンフレット

自然で回復的な、それは暗い岩の間に成長する丈夫なセージのように感じます。深いチャコールグリーンが見出しと写真のキャプションをアンカーし、柔らかいセージと淡いミストの色合いがページを明るく通気性に保ちます。この組み合わせは、自然の写真、木の質感、シンプルなアイコンとよく合います。ヒント: 読みやすさのために本文のテキストを最も明るいトーンに保ち、セクション ディバイダーにのみミッド セージを使用します。

media.ioを使って生成した火山セージの画像例

12) 焦がしたココア

HEX：#120d0b #3a251e #624036 #8d6a5a #dcc7b7

雰囲気：居心地が良くてプレミアム

おすすめ用途：チョコレートラベルデザイン

居心地がよくプレミアムなこのシリーズは、ダークチョコレート、ココアパウダー、クリーミーなフィリングのように読みます。大胆なラベル フレームには最も深い色合いを使用し、イラスト パターンや原産地マップにはココア ミッドトーンを使用します。軽いクリームは、フレーバー名や材料セクションにグルメなタッチを加えています。ヒント: セリフ ヘッドライン フォントと組み合わせると、クラシックで職人技の雰囲気になります。

media.ioを使って生成した焦げたココアの画像例

13) ファイヤーライト黄土

HEX：#2b1a0f #6a3a18 #b15a1d #d98b3a #f3d2a0

雰囲気：魅力的で元気な

おすすめ用途：レストランメニューデザイン

魅力的でエネルギッシュで、石垣の火と空気中の黄金色のスパイスを呼び起こします。これらの火山色の組み合わせは、あまり赤く見えずに暖かさが必要なメニューに最適です。テキストバーとセクションバーには最も濃い茶色を使用し、価格、スペシャル、コールアウトには明るい黄褐色を予約します。ヒント: オレンジが鮮明で読みやすいように、明るい砂の色合いを主な紙色にしてください。

media.ioを使って生成したfirelight ochreの画像例

14) アイアンリッジ

HEX：#0f1214 #2c3136 #555d63 #8b6f5a #d4c7bb

雰囲気：工業および精製された

おすすめ用途：アーキテクチャポートフォリオウェブサイト

インダストリアルで洗練されたこれらのトーンは、鉄の梁、スレートコンクリート、暖かい石の塵のように感じます。ナビゲーションとプロジェクト タイトルにはダーク ペアを使用し、淡いベージュに寄りかかり、すっきりとしたギャラリーとゆったりとした間隔を表示します。落ち着いたストーンブラウンは、ミニマルな外観を損なうことなく、ボタンやホバー状態に暖かさを加えます。ヒント: インターフェイスの色がまとまったままになるように、画像をわずかに不彩度に保ちます。

media.ioを使って生成したiron ridgeの画像例

15) 燻製テラコッタ

HEX：#2a1714 #5f2a22 #9e4b3a #c96b54 #f0c8b6

雰囲気：ロマンチックで素朴な

おすすめ用途：結婚式の招待状スイート

ロマンチックで土っぽく、夜遅くの輝きで温まったテラコッタタイルのような感じです。ダークワインブラウンは名前や日付にエレガントなコントラストを与え、柔らかいテラコッタの色合いは花柄、ボーダー、モノグラムに適しています。チークの色合いは、レイアウトを風通しがよくモダンに保つのに役立ちます。ヒント: 中央のテラコッタを平らなインクとして印刷し、読みやすさを保つためにキー テキストにのみ最も暗い色合いを使用します。

media.ioを使って生成した燻製テラコッタの画像例

16）耐震スレート

HEX：#111417 #283038 #4a5661 #7a6a62 #c7c0bb

雰囲気：クールでテクニカル

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

クールで技術的な、それはスレートロック、スチールパネル、ダストストーンのように読みます。濃い色合いはダッシュボードの強力なベースになり、淡いグレーはテーブルやカードを清潔に保ちます。明るい色なしで強調したい場合は、主要な指標やアラートのハイライトとして暖かいトープを追加します。ヒント: グラフの線には中央のスレートを使用して、目に見えるようにしますが、厳しくないようにします。

media.ioを使って生成した地震スレートの画像例

17）ヒートヘイズ

HEX：#2b231a #6a5538 #b08a58 #e0c08a #f6eedc

雰囲気：日差しが当たってかすんでいる

おすすめ用途：旅行ブログのヘッダーデザイン

太陽が差し込み、かすんでいるこのパレットは、空気中のほこりと砂漠の岩の暖かい光のように感じられます。攻撃的な飽和せずに暖かさを求めるヘッダーやヒーローセクションに適しています。サイト名とナビゲーションには最も濃い茶色を使用し、黄金色の日焼けをグラデーションまたは微妙なブロックで重ねます。ヒント: テキストオーバーレイを読みやすくするために、写真を暖かく低コントラストに保ちます。

media.ioを利用して発生するヒートヘイズの画像例

18) カルデラクリーム

HEX：#2a2420 #61564c #a39486 #d8cec3 #fff7ee

雰囲気：柔らかくエレガント

おすすめ用途：スキンケアランディングページ

柔らかくエレガントで、温かい石に対してミネラルクレイマスクとクリーミーな泡を呼び起こします。クリームをメインキャンバスとして使用し、ナビゲーション、アイコン、優しい仕切りにトープとココアを持ち込みます。ミッドベージュは、微妙な分離が必要な商品カードやフィーチャーブロックに最適です。ヒント: 落ち着いた美観を維持しながら、明確なコントラストのためにボタンを最も暗い色合いに保ちます。

media.ioを使って生成したカルデラクリームの画像例

19) フマロールシダ

HEX：#1a1f19 #344036 #556b4b #8aa16a #e0e7d3

雰囲気：フレッシュで素朴な

おすすめ用途：ハーブティーパッケージ

新鮮で土っぽい、暗い岩と蒸気の横にある緑のシダの葉を思い出させます。深い森の色調はウェルネス製品に信頼できるように感じられ、淡いミストの色合いはラベルを清潔で読みやすく保ちます。フレーバーキュー、シール、または小さなパターンのアクセントには、明るいシダグリーンを使用してください。ヒント: シンプルなボタニカル ライン アートと組み合わせると、グリーンが主人公のままになります。

media.ioを使って生成したフマロールシダの画像例

20) 地平線の煙

HEX：#1b1c1e #3c3f44 #70757b #b6b0a9 #efe8df

雰囲気：清潔でプロフェッション

おすすめ用途：プレゼンテーションテンプレート

清潔でプロフェッショナルで、柔らかく暖かい光で地平線の遠くの煙のように見えます。タイトルスライドやセクションブレークにはチャコールを使用し、コンテンツの多いページにはライトベージュを使用してください。ミッドグレーは、厳しいコントラストなしにグラフや図をきれいに保ちます。ヒント: スライドごとに 1 つのアクセントに固執し、デザイン作業のほとんどを空白に任せます。

media.ioを使って生成したhorizon smokeの画像例

火山に合う色は？

ボルケーノトーンは、コンポジションの通気性を保ち、暗いベースが重く感じるのを防ぐ暖かいニュートラル（砂、クリーム、トープ）と最もよく合います。これらの明るい色合いは、タイプの多いレイアウトの読みやすさも向上します。

コントラストを強くするには、エンバーオレンジ、銅、黄土などの制御されたアクセントを追加します。控えめに使用すると、ボタン、価格、見出し、または製品シールの明確な焦点が作成されます。

より自然な方向性が必要な場合は、落ち着いたグリーン（セージまたはシダ）を導入してください。溶岩の赤の熱を和らげ、火山のパレットをエコ、ウェルネス、旅行のブランディングに美しく機能させます。

火山カラーパレットを実際のデザインで使う方法

背景、フレーム、ナビゲーションには「ロック ベース」(チャコール、スレート、ディープ ブラウン) から始め、インタラクティブな要素と強調には「ヒート アクセント」(エンバー、テラコッタ、銅) を 1 つ選択します。これにより、テーマのまとまりが保たれ、過度の飽和を回避できます。

ネガティブなスペース、カード、テキスト領域には、最も明るい色合い(クリーム、砂、ミスト)を予約してください。ボルケーノ パレットは、広々とした間隔があり、ハイライトが石に反射する光のように使用されると高級感があります。

印刷の場合は、マットペーパー、微妙なグレイン、最小限のグラデーションなど、テクスチャに傾きます。UI の場合は、ウォーム アクセントを状態 (デフォルト/ホバー/アクティブ) 全体で一貫して保ち、インターフェイスがノイズではなく意図的に感じられるようにします。

AIで火山パレットのビジュアルを作成

すでに 16 進コードをお持ちの場合は、レイアウト、スタイル、各色の表示場所を説明することで、一致するビジュアル (ポスター、パッケージ モックアップ、ソーシャル タイル、UI 画面) をすばやく生成できます。

上のプロンプトを出発点として、火山の色の方向（灰のベース+エンバーのアクセント+砂のハイライト）を一定に保ちながら、件名（メニュー、パンフレット、ラベル）を入れ替えます。

反復するときは、一度に 1 つの変数 (タイポグラフィ スタイル、構成、またはテクスチャ) を変更して、結果を比較してパレットをブランド通りに見せることができます。

次へ： アンバーカラーパレット