サーモンティール配色アイデア20選とHEXコード一覧

サーモンとティールは、暖かみ（サーモン）と涼しさ（ティール）をバランスよく組み合わせた、現代的でコントラストの強い配色です。中間色や濃い色を加えることで、遊び心のある雰囲気、高級感、海岸らしさ、テクノロジー感など、幅広い印象を簡単に演出できます。

以下は、すぐに使えるHEXコード付きのサーモン＆ティール配色20選と、ブランディングやUI、印刷、プロダクトデザイン用ビジュアル生成に使えるデザインプロンプトです。

なぜサーモン＆ティール配色はこれほど効果的なのか

サーモンとティールは暖色・寒色スペクトルの反対側に位置しているため、組み合わせると自然と視覚的なエネルギーが生まれます。サーモンは親しみやすさと人間味、ティールは新鮮さや信頼感、構造をもたらします。

このコントラストは階層表現にも役立ちます。サーモンは注目を集める要素（見出し、ハイライト、バッジなど）に最適で、ティールはUIの機能的要素（ボタン、ナビ、グラフ）に適しています。オフホワイトや濃いチャコールを加えることで、印刷にも画面にも柔軟に使える配色になります。

どちらの色も「モダンクラシック」な雰囲気があるため、サーモン＆ティールは砂色の中間色で海岸風に、くっきりとしたオフホワイトとほぼ黒でエディトリアル風に、また真鍮やゴールドをアクセントにして高級感もすぐに演出できます。

20以上のサーモン＆ティール配色アイデア（HEXコード付き）

1）コースタル・コーラル・ドリフト

HEX： #FA8072 #1BA6A6 #FFF1E6 #2F3A3D #E6D2C3

ムード： エアリー、海岸風、リラックス

おすすめ： ビーチリゾート・ブローシャーカバー

エアリーで海岸らしく、リラックス感があり、澄んだ水辺の温かい砂浜を思わせます。サーモンを親しみやすい見出し色に、ティールをアクション誘導やセクションバーに使用。クリーム地とチャコール系の文字色でレイアウトを引き締めます。コツ：ティールは広めに配置し、コーラルのアクセントを意図的に見せるとバランス良くなります。

media.ioで生成したコースタル・コーラル・ドリフトの画像例

Media.io

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

今すぐ無料で試す

2）シーフォーム・サンセット

HEX： #FF7F73 #2EC4B6 #FFE8DF #0F4C5C #F2C6B6

ムード： ロマンチック、爽やか、楽観的

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

ロマンチックで爽やか、夕日の余韻がシーフォーム（海の泡）に淡く溶けるような配色。サーモン＆ティールのパレットは、用紙を明るめに保ち、ティールに細部を任せると招待状に映えます。濃いブルーグリーンを文字や細い枠に使って全体を引き締めましょう。コツ：名前にサーモン、スケジュールにティールで視覚的階層が分かりやすくなります。

media.ioで生成したシーフォーム・サンセットの画像例

3）レトロ・ソーダショップ

HEX： #FF6F61 #00A7A7 #FFF7E8 #3B2E2A #F6C453

ムード： 遊び心、レトロ、高いエネルギー感

おすすめ： ビンテージ風ポスター

遊び心とレトロ感たっぷり、クラシックなカウンターのネオンサインや炭酸飲料の雰囲気。サーモンを大きなディスプレイ文字に、ティールをアウトラインやバッジ、星形に活用。クリーム色が可読性を保ち、ブラウンが懐かしいインク感を添えます。コツ：ゴールデンイエローは1箇所だけ使うと印象的に仕上がります。

media.ioで生成したレトロ・ソーダショップ画像例

4）ノルディック・スパ・カーム

HEX： #F58B7B #5BC0BE #F7F7F2 #2D3142 #C7DAD9

ムード： 穏やか、清潔、癒し

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

穏やかでリフレッシュできるイメージ。蒸しタオル、清潔なタイル、静かな朝を想起させます。ほぼ白の背景を主役にし、ティールをボタンやアイコンなど信頼感が必要な部分へ。サーモンはプロモーションや主なメリットなどの強調に控えめに使いましょう。コツ：影は涼しげに控えめにして、スパのような空気感をキープ。

media.ioで生成したノルディック・スパ・カーム画像例

5）トロピカル・パンチ

HEX： #FF6B6B #00B3B3 #F8FFE5 #1B4965 #BEE9E8

ムード： トロピカル、明るい、爽やか

おすすめ： 夏のSNS広告

トロピカルで明るい、冷たいプールにフルーツパンチが映えるイメージ。サーモンをメインオファーの文字色に、ティールを枠やボタン、スワイプ誘導に使います。背景は淡くして、モバイルでも可読性を保ちます。コツ：ダークネイビーは小さな文字やロゴのみに抑え、全体の軽やかさを損なわないようにしましょう。

media.ioで生成したトロピカル・パンチ画像例

6）ブラッシュ＆ブラス

HEX： #F47C7C #1F9E9E #FFF3E6 #B88A2B #2B2D42

ムード： 洗練、温かみ、高級感

おすすめ： ブティック商品パッケージ

洗練と温かみで、サテンのようなブラッシュと真鍮の輝き。ティールを構造に、サーモンを柔らかな雰囲気にと分けることで、サーモン＆ティール配色は高級パッケージに最適です。ブラスは箔押しなど細かなディテールに使い、背景はクリーミーでブティックらしい上質感に。コツ：大きなティールパネルにサーモンのラベルを乗せると瞬時にコントラストが生まれます。

media.ioで生成したブラッシュ＆ブラス画像例

7）モダン・ギャラリーウォール

HEX： #FF8C7A #2A9D8F #F4F1DE #264653 #E9C46A

ムード： モダン、厳選、アーティスティック

おすすめ： リビングのインテリアアクセント

モダンで厳選された雰囲気、暖色のプリントと涼しげなセラミックが並ぶギャラリーウォールをイメージ。ティールは大きめのラグやソファなど主役級アイテム、サーモンはアートやクッション、スローなどアクセントに。クリームと深いブルーグリーンでまとまった印象に仕上がります。コツ：ゴールデンイエローは2つの小物にだけ使い全体をまとめましょう。

media.ioで生成したモダン・ギャラリーウォール画像例

8）ミンテッド・ウェディングペーパー

HEX： #F98A7A #66D1C9 #FFFFFF #355070 #E9D8A6

ムード： 上品、軽やか、お祝いムード

おすすめ： ミニマルなウェディングセーブザデート

上品ですっきりとしたお祝い感、コンフェッティを思わせるさっぱり感のある用紙。レイアウトは極力ミニマルに、ホワイト空間＋日付や区切り線にティール、名前やモノグラムにはサーモン。小さな印刷部分も可読性に優れるよう紺色の文字を使用。コツ：ティールは画面よりも少し明るめに刷ると全体的に軽やかに仕上がります。

media.ioで生成したミンテッド・ウェディングペーパー画像例

9）デザートオアシス

HEX： #F77F7F #3AB7A8 #F2E9E4 #6D597A #E6B8A2

ムード： アース感、静けさ、日差しの温もり

おすすめ： 旅行ブログ・ヘッダー

大地の温もりと涼やかな泉、まるでキャニオンロックとクールな湧き水の出会いのような配色。サーモンはタイトルなど主な強調部分、ティールはナビゲーションやリンクに。くすみ中間色で写真や地図が自然に溶け込みます。コツ：くすみパープルは小さなポイントのみに使い、ティールとの争いを避けましょう。

media.ioによって生成された砂漠のオアシスの画像例

10）テッキータイドUI

HEX： #FF7A6E #0FB9B1 #F6F8FF #1F2A44 #C9D6DF

ムード： クリーン、モダン、自信

おすすめ： アナリティクス ダッシュボードUI

クリーンで自信のある印象は、鮮明なデータカードとフレンドリーなカラーのパンチです。このサーモンティールのカラースキームは、グラフや状態でティールをメインに使い、サーモンはアラートや重要な指標に限定すると最適です。表面はほぼ白にし、濃いネイビーはテキストのコントラスト用に。ポイント：サーモンは各ビューにつき一つのグラフシリーズだけに使い、視覚的なノイズを減らすことをおすすめします。

media.ioによって生成されたテッキータイドUIの画像例

11）コーラルリーフポスター

HEX： #FF6F7D #00A0A0 #FFF0F0 #073B4C #FFD166

ムード： 大胆、アクアティック、冒険的

おすすめ： 海洋保全ポスター

大胆でアクアティックな印象は、深い水を切り裂くサンゴの枝を思わせます。大きな背景にはティールを使い、サーモンはヘッドラインのアイキャッチに。補足コピーは暗く詰めて読みやすさを。ポイント：明るい黄色は統計バッジや寄付の呼びかけだけに使いましょう。

media.ioによって生成されたコーラルリーフポスターの画像例

12）ソフトナーサリースプラッシュ

HEX： #F9A394 #5FD3C2 #FFF9F2 #4A4E69 #DDEFEA

ムード： 優しい、安心感、遊び心

おすすめ： ベビーシャワー招待状

優しく安心感があり、水彩のドットが柔らかなコットンの上にあるような印象です。背景はクリーミーに保ち、ティールはボーダーや星やハートなどの小さなアイコンに。サーモンは名前やイベントタイトルの温かいアクセントに最適です。ポイント：丸みのある書体を選び、コントラストは中程度にすると甘さを保てます。

media.ioによって生成されたソフトナーサリースプラッシュの画像例

13）ビストロメニューシック

HEX： #F26A5A #2AA198 #FDF6E3 #2D2A32 #E0C097

ムード： 居心地良い、シック、食欲をそそる

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

居心地良くシックな印象は、賑やかなビストロと暖かな照明、クールなタイルを思わせます。サーモンはセクションヘッダー、ティールは細い仕切り線やアイコン、価格のハイライトに。クリーム色は薄暗い照明下でもメニューが読みやすく、チャコールは細かな記載を支える役割です。ポイント：ティールのラインは細く保つことで、メニューがスポーティーにならず上品に。

media.ioによって生成されたビストロメニューシックの画像例

14）スキンケアスタジオクリーン

HEX： #FF8A80 #00B8B8 #FFFFFF #22333B #E8F5F2

ムード： フレッシュ、クリニカル、信頼感

おすすめ： 商品広告スチルライフ

フレッシュで信頼感があり、明るいスタジオで光沢のあるボトルと清潔なラベルが並ぶ印象です。ティールをパッケージのブランドカラーにし、サーモンは目立つ主張や成分の呼びかけに。白や淡いミントは衛生的でプレミアムな雰囲気にします。ポイント：サーモンの要素はマット素材にして、ティールを圧倒しないようにしましょう。

media.ioによって生成されたスキンケアスタジオクリーンの画像例

15）エディトリアルウィークエンド

HEX： #F97C6D #3DB7B0 #FAF9F6 #111827 #D1D5DB

ムード： スタイリッシュ、ミニマル、編集的

おすすめ： 雑誌特集スプレッド

スタイリッシュでミニマル、週末雑誌のようにクリーンなグリッドと自信のある見出しが特徴です。サーモンはプルクォートに、ティールはセクションタブや号ラベルに。本文はほぼ黒で、オフホワイトのページ色がコントラストを柔らかくします。ポイント：色の使用はスプレッドの上1/3程度に限定するとレイアウトが高級感を保ちます。

media.ioによって生成されたエディトリアルウィークエンドの画像例

16）ビーチリゾートブローシャ

HEX： #FF7E67 #14A098 #F6F1E9 #0B1320 #C7EAE4

ムード： 招きやすい、爽やか、洗練

おすすめ： 三つ折りパンフレットデザイン

招きやすく爽やかな印象はリネンの質感やシーグラスを思わせます。大きなパネルやナビゲーションにティール、サーモンは重要なオファーや予約詳細に使います。温かいオフホワイト背景は親しみやすさを演出し、ほぼ黒のテキストは細かい記載に。ポイント：アイコンに薄いティールを繰り返して、パンフレット全体に統一感を持たせましょう。

media.ioによって生成されたビーチリゾートブローシャの画像例

17）セラミックスタジオグレーズ

HEX： #F27D72 #2AB7CA #F5F0EA #374151 #C8B6A6

ムード： 手作り、モダン、触感的

おすすめ： セラミック商品ラベルセット

手作りで触感的な印象は、光沢のある釉薬と温かい粘土を思わせます。ラベルのタイトルはサーモン、成分リストやロット番号、スタンプにはティールを。温かいニュートラルはアート感を演出し、スレートはタイポをクリーンに保ちます。ポイント：テクスチャード紙に印刷することで、柔らかいトーンが意図的かつ上質に見えます。

media.ioによって生成されたセラミックスタジオグレーズの画像例

18）フィットネスアプリポップ

HEX： #FF6B81 #00C2B2 #F7FAFC #1A202C #CBD5E0

ムード： エネルギッシュ、モダン、モチベーション

おすすめ： フィットネスアプリ・オンボーディングUI

エネルギッシュでモチベーションが沸く印象は、明るいスタートと明確な目標、前向きな勢いを感じさせます。ティールは主要なボタンや進捗リングに、サーモンはストリーク、達成時、ミニセレブレーションに使いましょう。背景は明るく、UI を呼吸できる雰囲気に。ポイント：サーモンティール配色は、サーモンを報酬カラーとして使うと最も映えます。

media.ioによって生成されたフィットネスアプリポップの画像例

19）ホリデーニットウォームス

HEX： #F47B72 #1AA6A0 #FFF7F0 #2B2D42 #CDE7E3

ムード： 居心地良い、祝祭的、フレンドリー

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

居心地良く祝祭的な印象は、現代的にアレンジされたニットパターンを思わせます。サーモンは挨拶文、ティールはシンプルなオーナメントやボーダーに。背景はクリーミーに、暗い色は署名など小さなテキストに。ポイント：薄いティールの微かなパターンを加えることでカードがテクスチャー感をもちつつ、煩雑になりません。

media.ioによって生成されたホリデーニットウォームスの画像例

20）データビズフレッシュネス

HEX： #FF7D6E #22B8B1 #F9FBFF #0B1220 #DDE3EA

ムード： 明快、フレンドリー、プロフェッショナル

おすすめ： インフォグラフィックレイアウト

明快でフレンドリーな印象は、ラベル付きのグラフと落ち着いた構成を感じさせます。メインシリーズにティールを、サーモンは一つのアクセントシリーズや重要なバッジだけに。ほぼ白背景でラベルの読みやすさを維持し、深いインク色はアクセシビリティを改善します。ポイント：ラインの太さを揃えて、色が主役になりスタイリングが控えめになります。

media.ioによって生成されたデータビズフレッシュネスの画像例

サーモン＆ティールに合う色は？

サーモンとティールの組み合わせは、クリーム、アイボリー、温かい砂色、淡いグレーなどの柔らかなニュートラルと相性が良く、パレットを呼吸しやすくし、温/冷コントラストが強すぎないようにします。タイポグラフィや構成には、濃いチャコール、インク、ネイビーが読みやすさをもたらします。

個性を加えたい場合はアクセントをひとつだけ追加しましょう：プレミアムパッケージなら真鍮/ゴールド、ポスターの呼びかけなら明るい黄色、砂漠の夕焼け風には淡いラベンダー/パープル。ポイントは、アクセントを限定しティールとサーモンが主役になるよう保つことです。

UIにおけるアクセシビリティは、最も暗い色で本文や小ラベルを担当し、ティールとサーモンは状態やハイライト、限定されたグラフシリーズに使用します。

実際のデザインでサーモン＆ティール配色を使う方法

まず役割を決めてスタートしましょう：ティールはシステムの主役色（ボタン、リンク、ナビゲーション、グラフの基準線）として、サーモンは強調色（ヘッドライン、バッジ、限定アラート）にします。これでページやコンポーネント間の階層が常に一貫します。

比率を調整して乱雑さを避けましょう—多くのデザインはニュートラルがキャンバスの大部分を占め、ティールが “フレーム”となり、サーモンは温かなスポットライトとして登場すると最も良く見えます。印刷の場合は、実際の用紙でスウォッチテストを。サーモンはより暖かく、ティールは暗く見える場合があります。

ブランディングでは、ひとつの色調（淡いミントや温かいクリームなど）を背景やアイコン、パッケージ素材全体に繰り返すことで、多色化せず統一感を出せます。

AIでサーモン＆ティール配色のビジュアルを作成

HEXコードがすでにあれば、レイアウトを説明し、サーモンとティールを主役色に指定するだけで素早くマッチするモックアップ（ポスター、UI画面、招待状、パッケージ）が生成できます。制作前にコントラスト・雰囲気・構成を検証するのに便利です。

上記プロンプトを出発点とし、フォーマット（正方形広告、パンフレット、ダッシュボード、カード）を入れ替えつつ、同じカラーロールを維持することで、サーモンティールのパレットで多方向を効率的に探れます。

お気に入りの方向性が見つかったら、同じプロンプトで変数はひとつだけ（書体、レイアウト密度、アクセント色など）変更して、速く反復し一貫性を保ちましょう。

次へ： 補色カラーパレット