スチームパンクのカラーパレット20選とHEXコード【配色例】

スチームパンクのカラーパレットは、ヴィンテージな工業感とレトロフューチャーな物語性を融合させます──真鍮の歯車、煤けた影、セピア色の紙、使い込まれた革などがイメージです。

以下に、ポスター、UI、ブランディング、パッケージングなどに使えるHEXコード付きのスチームパンクカラーパレットのアイデアを紹介します。さらに、金属のアクセントを鮮明に読みやすく保つコツも付いています。

なぜスチームパンクパレットがとてもよく機能するのか

スチームパンクのカラースキームは、真鍮、銅、インク、レザー、羊皮紙、煙など、現実に存在する素材を基盤としています。そのため、フラットなUIやクリーンなブランディングでもすぐに触覚的で“リアル”に感じられます。

ほとんどのスチームパンクの配色は自然と高いコントラストをもちます：構造にはダークチャコールやエスプレッソブラウン、可読性のためのウォームニュートラル、強調のために制御されたメタリックゴールドや銅。

また、ジャンルを問わず柔軟に使えます。ブルーやティールでテクニカルなレトロフューチャー感を出したり、アイビーグリーンで石造り遺産の雰囲気を加えたり、セピアや錆色でアーカイブ調の物語性を演出したりできます。

20種類以上のスチームパンクカラーパレットアイデア（HEXコード付き）

1）真鍮と石炭

HEX： #b08d57 #3a2f28 #1f1b17 #d7c3a1 #7a4e2d

雰囲気： 工業的、温もり、無骨

最適用途： ヴィンテージ工房のブランドアイデンティティ

真鍮と煤の雰囲気を持つ工業的な温もり、歯車にランプの光、革に煤が積もったような印象。深いチャコールはタイポグラフィや構造に最適で、真鍮は高級感あるアクセントに。クリーム色が印刷やウェブのレイアウトを読みやすくキープ。コツ：真鍮色はボタンやシール、重要アイコンだけに使い、全体が曖昧にならないようにしましょう。

media.ioで生成した真鍮と石炭の画像例

Media.io

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

今すぐ無料で試す

2）銅の歯車

HEX： #b86b4b #6b3f2a #2b2320 #e0b29a #4c6b6a

雰囲気： 機械的、温かみ、手作り感

最適用途： 手作り商品のパッケージデザイン

磨かれた銅、オイル仕上げの木、酸化した機械の風合いのような温かみのあるメタル系トーン。深いブラウンがデザインの基礎を支え、赤みがかった銅が親しみや手作り感を演出。アクセントには落ち着いたティールを小さく使いラベルやフレーバー差別化に。コツ：銅色はマットインクで印刷し、輝きはごく一部のグラデーションで表現しましょう。

media.ioで生成した銅の歯車の画像例

3）セピア工房

HEX： #a67c52 #6f5b3e #2f2a24 #e6d3b1 #8b3a2b

雰囲気： ノスタルジック、荒削り、物語性

最適用途： メイカーズフェアのイベントポスター

セピア写真のようなノスタルジックさと荒削り感、混雑した工房で設計図の横に古写真がピン留めされているような雰囲気の配色。ポスターで使うと、クラシックな個性を出しつつコントラストも充分です。背景は羊皮紙色に、濃いテキストや日付用の赤錆系でレイヤーを。コツ：ミッドブラウンの細いラインアートを加え、彫刻風ディテールを控えめに表現。

media.ioで生成したセピア工房の画像例

4）ベルベットエンジン

HEX： #3b1f2b #7a3e5a #c8a36a #141214 #e6dccf

雰囲気： ドラマチック、豪華、夜の雰囲気

最適用途： レトロフューチャー音楽アルバムカバー

劇的で豪華、ベルベットのカーテンが開き、唸るエンジンルームが現れるような雰囲気。プラム色とほぼ黒で映画的な土台を作り、アンティークゴールドがスポットライトになります。温かなオフホワイトは曲目や小さい文字に控えめに使うと上品さをキープ。コツ：ゴールドのアクセントはグリッド揃えで配置し、ランダム感を避け高級感を演出しましょう。

media.ioで生成したベルベットエンジンの画像例

5）飛行船の夜明け

HEX： #e7c7a1 #c98b63 #8a5a3c #33424a #f2efe9

雰囲気： 冒険的、楽観的、開放感

最適用途： 旅行ブログのヘッダーとヒーローバナー

日の出がリベットの船体や帆布のセイルを照らすような冒険的で明るい印象。ソフトなクリーム・サンドカラーで抜け感を出し、スレートブルーでナビゲーションや見出しの構造強化。ウォームブラウンを紙目やステッチライン等のテクスチャと組み合わせて。コツ：CTAボタンはスレート色にして、温かみある写真の上でもしっかり目立つように。

media.ioで生成した飛行船の夜明けの画像例

6）燻製レザー

HEX： #5a3a2e #2b1f1a #c2a27a #8a6f4b #d9d1c6

雰囲気： ムーディー、男らしい、触感的

最適用途： ウイスキーボトルのラベルとネックタグ

使い込んだ革、パイプの煙、バーの奥の温かい木のようなムーディーかつ触覚的なパレット。明るい色は余白や呼吸スペース用に絞り、ダークブラウンで重厚さを演出。彫刻風セリフ体やシンプルな紋章アイコンと組み合わせると本格的な雰囲気に。コツ：ゴールドベージュの小さな箔パーツでプレミアム感を一点だけ強調しましょう。

media.ioで生成した燻製レザーの画像例

7）時計塔の蔦

HEX： #2f4b3a #6b7c4a #b08d57 #2a2623 #e7dfd3

雰囲気： アーシー、神秘的、ヘリテージ

最適用途： もう一つの歴史を描いた小説のカバー

ツタが絡む時計塔、霧に浮かぶ真鍮の針のようなアーシーで神秘的な雰囲気。グリーンがメタリックな色調を中和し、パレットが無骨すぎない印象に。ほぼ黒はタイトル、クリーム色はサブタイトルの可読性用に。コツ：淡い背景色に薄いギア柄を重ねて、近くで見たときだけ分かるようにしましょう。

media.ioで生成した時計塔の蔦の画像例

8）ギアボックス・ティール

HEX： #2b6f73 #0f2f33 #b08d57 #c9d2cf #5b3a2e

雰囲気： テクニカル、クール、モダンヴィンテージ

最適用途： メーカー向けアプリのダッシュボードUI

エナメルダイヤルや海で使い込まれた金属板のようなテクニカルでクールな印象のパレット。ティールと深い青緑がパネルの基礎になり、アンティーク真鍮がトグルやハイライトに映えます。淡いグレイッシュブルーはカードや間隔用で、UIに余白感を。コツ：ブラス色はアクティブ状態だけに用い、全体の強調ポイントが散漫にならないように。

media.ioで生成したギアボックス・ティールの画像例

9）酸化銅

HEX： #3f7f7a #1e4b4a #b56a4a #2a201b #e8d7c8

雰囲気： 風化、海沿い、発明的

最適用途： 博物館展示のサイネージ

荒れた風合いと創造性、塩気のある空気や作業場の熱の中で年を重ねた銅のよう。青緑のトーンはパネルに静けさを与え、銅やエスプレッソが歴史的なインパクトを加える。現代的な印象に保つには、シンプルなサンセリフ体と組み合わせるのが良い。アドバイス：本文には最も濃い色を使い、銅色はセクション見出しや矢印だけに使いましょう。

media.ioで生成した酸化銅の画像例

10) 特許用紙

HEX： #efe2c8 #cdb892 #8b6b4a #2c2a28 #4d6a7a

雰囲気： アーカイブ、精密、学術的

最適用途： デザイン雑誌の編集レイアウト

アーカイブ的で精密、黄ばんだ紙に鮮明なインクラインで描かれた特許図面のよう。こうしたスチームパンクの配色は長いページでもニュートラルな色が目に優しく、すっきり見える。見出しやセクション区切りにはスレートブルーを使い、誌面を現代的に。アドバイス：余白を広く取り、最も暗い色を見出しやキャプションに使うと統一感を保てます。

media.ioで生成した特許用紙の画像例

11) ナイトレール

HEX： #0f0f12 #2d2a2f #7a4e2d #b08d57 #c6c2bb

雰囲気： 映画的、都市的、影のある

最適用途： 歴史チャンネル用YouTubeサムネイルテンプレート

映画的で影のある、真夜中の駅で真鍮のサイネージが最後の光を浴びるような印象。ブラックやグラファイトがサムネイルに強いコントラストを生み、暖色ゴールドが小さなサイズでも要点を読みやすくする。太く凝縮された書体とシンプルな形状を選び、複雑なテクスチャーは避けましょう。アドバイス：キーテキストはライトグレーで縁取りし、暗い背景に溶け込まないように。

media.ioで生成したナイトレールの画像例

12) アンバーランタン

HEX： #e09f3e #b07d2a #5a3a2e #2a2623 #f2e6d6

雰囲気： 輝き、歓迎、祭りの雰囲気

最適用途： カフェのメニューデザイン

輝きと暖かさ、磨かれた木に映る琥珀色のランタンのよう。ハイライトや価格目立たせには明るいアンバーを使い、見出しや構成には濃いブラウンを頼りましょう。クリーミートーンはメニューを明るく読みやすくしますが、真っ白にはしません。アドバイス：目立たせたい特別メニューには最も強いアンバーを1、2点だけ使い、注目を集めましょう。

media.ioで生成したアンバーランタンの画像例

13) スチームサファイア

HEX： #1c3d5a #2f6f8f #b08d57 #2a201b #d9d6cf

雰囲気： 発明的、鮮明、高コントラスト

最適用途： アプリのオンボーディング画面

発明的かつシャープ、青いエナメルのメーターが真鍮シャーシに灯るような印象。こうしたスチームパンク配色はオンボーディングに適し、ブルーは現代的、ゴールドは自信あるアクセントとして映えます。背景は淡いグレーのまま、最も暗いブラウンはキーテキストのみに。アドバイス：グラデーションはブルー系だけに限定し、金属アクセントを清潔でフラットな印象に。

media.ioで生成したスチームサファイアの画像例

14) リベットローズ

HEX： #8b3a2b #c47a6a #b08d57 #2b2320 #f2e3d7

雰囲気： ロマンチック、華麗、ヴィンテージ

最適用途： 工業系会場用ウェディング招待状

ロマンチックで装飾的、ロックに刻んだ薔薇色の金属細工や彫刻模様のよう。温かみあるスチームパンクのパレットはヴィンテージ感たっぷりで、暗くなりすぎず招待状にぴったり。メインカードには淡いピンクとクリームを組み合わせ、テキストはエスプレッソ、枠線には真鍮を使いましょう。アドバイス：装飾線は細くし、空気感と高級感を損なわないように。

media.ioで生成したリベットローズの画像例

15) ファウンドリークレイ

HEX： #9b6a4a #c2a27a #6b3f2a #2f2a24 #e8dccb

雰囲気： 地に足がついた、クラフト、土の香り

最適用途： 陶芸スタジオのロゴとラベル

地に足がついた土の温もり、窯で焼かれた粘土、温かい砂、鉄の道具のそばにあるような雰囲気。中間色は手作り感を演出し、濃いブラウンはロゴやスタンプの主役に。淡いベージュはラベル用紙の色として使い、濃いトーンで印刷しましょう。アドバイス：ロゴにはヒーロー色を一つだけ決め、残りはパターンやバッチコードに使うとよいです。

media.ioで生成したファウンドリークレイの画像例

16) ウイスキーワルナット

HEX： #7a4e2d #4b2f22 #d2b48c #2a2623 #e9dfd2

雰囲気： クラシック、洗練、温かみ

最適用途： レストランウェブサイトUIテーマ

クラシックで洗練された、柔らかな光の下でウォールナットのパネルとウイスキーグラスが置かれたような空間。濃い色はヘッダーやナビゲーションに、クリーミーなニュートラルはページ背景用。タン色は仕切りやホバーステートの控えめなアクセントになります。アドバイス：本文は最も濃いブラウンで、完全なブラックでなく温かみを保ちましょう。

media.ioで生成したウイスキーワルナットの画像例

17) モナークベルベット

HEX： #2a1b2f #4a2b4f #b08d57 #7f6a58 #f1ece6

雰囲気： 王侯、演劇的、ムーディー

最適用途： 劇場のプレイビル表紙

王侯のようで演劇的、ゴールドの縁取りと深いベルベットのカーテンがかかる薄暗い舞台。パープルブラウンは劇的だけど派手すぎず、アンティークゴールドはクラシック劇場の装飾に見える。ハイコントラスト書体と左右対称の装飾でフォーマルな印象に。アドバイス：イメージはモノクロに、強調点はゴールドだけに任せましょう。

media.ioで生成したモナークベルベットの画像例

18) フォギーハーバー

HEX： #6b7c86 #2f3a3f #b56a4a #d6d9d8 #1f1b17

雰囲気： 霧、海港、工業的

最適用途： 探索マップ用ゲームUI

霧に包まれた港、鉄のレールや銅の装具があるようなマリン＆インダストリアル感。グレーブルーはUIパネルを落ち着かせ、温かい銅色は操作可能なホットスポットに。読みやすさのために、ラベルはほぼ黒、地図のオーバーレイは淡いグレーに。アドバイス：銅色はピンやクエストなど、アクション1種類だけに使い、システムを直感的に。

media.ioで生成したフォギーハーバーの画像例

19) ティンクチャーボトル

HEX： #2f4b3a #2b6f73 #c98b63 #efe2c8 #2c2a28

雰囲気： 薬草師、好奇心、多様性

最適用途： エッセンシャルオイル用植物ラベルセット

薬草師的で好奇心をそそる、手書きラベルと苔むしたガラスのティンクチャーボトルが並ぶ棚。グリーンやティールが植物的な土台を作り、温かいタン色がハンドメイドの心地よさを加える。はっきりした階層を作るには、テキストはパーチメント色、最も濃いトーンは成分詳細に。アドバイス：イラストの線は細く均一に保ち、ラベル全体の統一感を高めましょう。

media.ioで生成したティンクチャーボトルの画像例

20) ブラスライトミニマル

HEX： #f2efe9 #d7c3a1 #b08d57 #4a4a45 #1f1b17

雰囲気： ミニマル、高級感、バランス

最適用途： ブティック時計ブランド用ランディングページ

ミニマルかつ高級感、柔らかい昼光とシャープな影の中で磨かれた真鍮のよう。スチームパンク配色でもニュートラルカラーが主役で、金属色は穏やかなアクセント。広々としたセクションにはオフホワイト、テキストはチャコール、重要なCTAだけにブラス色を。アドバイス：淡いベージュで繊細な仕切り線を加え、レイアウトの静けさを保ちます。

media.ioで生成したブラスライトミニマルの画像例

21) ブループリントブラス

HEX： #244a6b #102b3a #b08d57 #c9d2cf #2a201b

雰囲気： 工学的、自信、鮮明

最適用途： テック講演用プレゼンテーションスライドテーマ

工学的で鮮明、設計図のインク線が磨かれた真鍮のネジと交わるような感じ。ディープブルーはスライドを強く囲み、ブラスアクセントで要点を目立たせても騒がしくならない。コンテンツブロックには涼しいライトグレーでチャートを読みやすく。アドバイス：ブラスはタイトルと目立たせたいデータ1か所だけに繰り返し使い、明快さを維持しましょう。

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

22) シンダーブロッサム

HEX： #2f2a24 #6b3f2a #c47a6a #e6d3b1 #b08d57

雰囲気： 柔らか、煙、ロマンチック

最適用途： バーテーマのバレンタインフライヤー

柔らかく煙る、花びらの下に温かい灰とゴールドの装飾。淡いピンクが遊び心を保ち、シンダーやコーヒーブラウンが成熟したムードを作る。背景にはパーチメントを使い、ゴールドはほんのり輝きとして加えましょう。アドバイス：見出しは最も暗い色で、淡いピンクはハートや飾りなど二次的なアクセントにだけ。

media.ioで生成したシンダーブロッサムの画像例

スチームパンクと相性の良い色は？

スチームパンクは、温かみある金属色（真鍮、アンティークゴールド、銅）と地に足のついたニュートラル（エスプレッソ、チャコール、パーチメント、ウォームグレー）が最良の組み合わせとなります。これらで「素材から作られた」印象のデザインになります。

対比を作るには、スレートブルーやディープティール、酸化グリーンなどのクール系も使えますが、少し落ち着かせてヴィンテージ・機械らしさを残しましょう。

モダンな雰囲気が必要な場合は、広めの余白と視認性向上にオフホワイトを追加し、最も濃いトーンは書体や主要UIラベルとして使いましょう。

実際のデザインでスチームパンクカラーパレットを活用する方法

まずニュートラルベースに：背景やダークモードではパーチメント/オフホワイトまたはディープチャコールを。アクセント用には金属色を1つだけ選び、CTAやバッジ、アイコンハイライトに。

可読性を保つには色の役割分担を：本文は最も暗い色、境界や二次UIには中間色、一番明るい温色は強調に。これでスチームパンク配色に起こりがちな「濁った茶色問題」を防げます。

印刷の場合は、メタリックカラーを控えめに使用し、マットインクを検討してください。デジタルの場合は、メタル感を繊細な陰影で小さな部分（ボタン、シール、装飾など）にのみ再現し、大きな面では使わないようにしましょう。

AIでスチームパンクパレットのビジュアルを作成

コンセプト提案やムードボード作成の際は、プロンプトから素早くスチームパンクのビジュアルを生成し、HEXベースのカラー指示で一貫性を持って仕上げましょう。

Media.ioを使えば、自分のカラーパレットに合わせたテーマポスターやUIモックアップ、ラベル案、カバー風グラフィックを作成でき、量産前のアイデア検討をサポートします。

デザインタイプ（ポスター/UI/パッケージなど）を説明し、「スチームパンク」を加え、主要な色（ブラス、チャコール、パーチメントなど）を指定すると、アウトプットを誘導できます。

次： シャムロックグリーンのカラーパレット