セルリアンは、現代的で空と海が出会う青色です。清潔感、楽観的、信頼感をすぐに感じさせます。UI、ブランディング、印刷物で人気があり、小さなサイズでもくっきりと読め、彩度が高くても落ち着きを保ちます。
下記は、使いやすいHEXコード付きのセルリアンカラーパレットのアイデアと、組み合わせ、コントラスト、それぞれのコンボが最も効果的な場面についての簡単なガイダンスです。
なぜセルリアンパレットはとても効果的なのか
セルリアンは「安心できる」ビジュアルゾーンに位置しています:レッドほどの緊迫感はなく活気を感じ、伝統的なネイビーよりも現代的です。このバランスにより、ブランド主導のデザインシステムにも表現力豊かなキャンペーンにも柔軟に使えます。
デジタルインターフェースでは、ボタンやリンク、ナビゲーションなどにも使えて、ニュートラルカラーとのバランスも良く、階層化に効果を発揮します。印刷物でも、コート紙/非コート紙を問わず認識しやすく、暖かいアクセントカラーとの組み合わせもきれいに決まります。
最も重要なのは、セルリアンは組み合わせの幅が広いことです。ミニマルなレイアウト用のエアリーホワイトやクールグレイ、高コントラストでインパクトあるビジュアル用のコーラル・アンバー・ネオンマゼンタまでペアにできます。
20種類以上のセルリアンカラーパレットアイデア(HEXコード付き)
1)オーシャングラス

HEX: #007BA7 #2BA9C9 #7DD6E8 #E6F7FB #0B2D39
雰囲気: フレッシュ、軽やか、水感
おすすめ用途: ウェブサイトのヒーローバナーや旅行のランディングページ
フレッシュでアクアティックなこれらの色調は、澄んだ海水やガラスのような波に陽射しが当たるイメージです。深いネイビーティールを土台に、ライトブルーをメインビジュアルに使ってください。ホワイトスペースや細いダークなタイポグラフィと合わせると、シャープで現代的な印象になります。ヒント:最も明るいシアンはボタンや主要リンクに使い、意図的に目立たせましょう(騒がしくならないように)。
media.ioを使って生成されたオーシャングラスのイメージ例
Media.ioは、ブラウザ上でビデオ、画像、音声の作成・編集ができるオンラインAIスタジオです。
2)コースタルミニマル

HEX: #0B7FAB #5FBBD2 #F2F5F7 #D9C7B8 #2E3A44
雰囲気: 落ち着き、クリーン、ビーチハウス風
おすすめ用途: ミニマルなブランドアイデンティティや文具類
落ち着いた穏やかなこの組み合わせは、流木、霧の朝、整った海辺のインテリアを連想させます。ソフトなオフホワイトをメイン背景に、ブルーを自信あるブランドの軸色に。サンディベージュは補助的なブロックやラベル、パッケージテクスチャに美しく使えます。ヒント:タイポは純黒ではなくチャコールにすると、柔らかく高級感のある印象になります。
media.ioを使って生成されたコースタルミニマルのイメージ例
3)セルリアン・コーラル・ポップ

HEX: #007BA7 #FF6B6B #FFD166 #F7FFF7 #1F2937
雰囲気: ポップ、明るい、エネルギッシュ
おすすめ用途: SNS広告やキャンペーングラフィック
ポップで明るいこの組み合わせは、ビーチフェスのポスターのように、大胆な形状と陽気な見出しの印象です。セルリアンを背景に、コーラルで視線を集めましょう。暖かいイエローはバッジや値札、小さいアイコンのハイライトに。ヒント:テキストは深いスレートで、鮮やかなアクセントとの可読性を守ってください。
media.ioを使って生成されたセルリアンコーラルポップのイメージ例
4)テックダッシュボードナイト

HEX: #0A2540 #007BA7 #00D1FF #7A8C99 #111827
雰囲気: スタイリッシュ、テクニカル、ナイトモード
おすすめ用途: SaaSダッシュボードやアナリティクスUI
スタイリッシュでテクニカル、このパレットは夜のコントロールルームのような雰囲気と発光インジケーターを連想させます。2色のダークブルーはパネルや面に使い、鮮やかなシアンをアクティブ状態やグラフに使いましょう。クールグレーでセクションを区切ると、煩雑にならず整理感が出ます。ヒント:ネオンのアクセントはUIの一画面やアクション(主ボタン、選択タブなど)だけに限定し、ハイライトの競合を避けましょう。
media.ioを使って生成されたテックダッシュボードナイトのイメージ例
5)プールサイドパステル

HEX: #3AAFD9 #8EE3F5 #FBE7F0 #FFF4D6 #2F4858
雰囲気: 優しい、明るい、夏っぽい
おすすめ用途: ウェルネスニュースレターやライフスタイルブログ
優しく明るいこれらのパステルカラーは、プールタイルや日やけ止め、風になびくタオルのイメージです。淡いアクアをゆったり背景に、濃いブルーで見出しや区切りバーを入れましょう。ブラッシュやバター色はアイコン、ステッカー、目立たせたい箇所のアクセントに。ヒント:本文テキストはミュートネイビーを使い、パステル面でもモバイルで読みやすく保ちましょう。
media.ioを使って生成されたプールサイドパステルのイメージ例
6)ノルディックスカイ

HEX: #1C86B8 #A7D8F0 #F7FAFC #C8D0D6 #22313F
雰囲気: クリスプ、軽やか、北欧風
おすすめ用途: プロダクトUIやミニマルブランディング
クリスプでエアリーなこのセルリアンパレットは、冬の光、淡い空、清潔なスカンジナビアインテリアを思い起こさせます。ほぼ白やミスティブルーは背景や間隔の広さに活用。濃いブルーはナビゲーションやアイコン、明確な階層化に使い、グレーは仕切り線やフォーム欄に。ヒント:十分なパディングと細いラインを活用し、クールトーンでも落ち着いた印象になるように。
media.ioを使って生成されたノルディックスカイのイメージ例
7)ヴィンテージトラベルポスター

HEX: #00739C #F2C14E #E07A5F #F4F1DE #3D405B
雰囲気: ノスタルジック、暖かい、シネマティック
おすすめ用途: イベントポスターやレトロプロモーション
ノスタルジックでシネマティックなこのミックスは、色あせた紙や海辺の列車旅、クラシックなポスターインクを思い出させます。まずウォームなクリームを敷き、タイトルや枠線にはディープインディゴでコントラストを。ゴールデンイエローやクレイコーラルは日付・チケット・バッジのアクセントに。ヒント:グレインテクスチャやシンプルな形状を使い、レトロ感を演出しながら分かりやすさも保ちましょう。
media.ioを使って生成されたヴィンテージトラベルポスターのイメージ例
8)ボタニカルブルーアジサイ

HEX: #1B7FB9 #5BC0EB #9BC53D #EAF7E1 #234F1E
雰囲気: ガーデン感、明るい、ナチュラル
おすすめ用途: ボタニカルイラストやエコブランディング
ガーデン感と明るさを持つこのカラーは、アジサイの花とシャキッとした春の葉を想起させます。柔らかなグリーンホワイトは紙のようなベース色に、ブルーで花びら・見出し・パッケージパネルを重ねましょう。鮮やかなグリーンはアイコンや認証マーク、サスティナビリティ表示のアクセントに最適です。ヒント:ダークフォレストトーンは小さな文字や輪郭ラインに使い、パレット全体が明るく親しみやすく保ちましょう。
media.ioを使って生成されたボタニカルブルーアジサイのイメージ例
9)サンセットピア

HEX: #0081AF #FFB703 #FB8500 #FFECD1 #2B2D42
雰囲気: 暖かい、明るい、海辺の夕暮れ
おすすめ用途: レストランのメニューや夏のプロモーション
暖かく明るいこのパレットは、太陽が桟橋の向こうに沈み、黄金色に染まる瞬間を表現します。ソフトクリーム色をメニューバックに使い、ディープネイビーで可読性の高いテキストに。オレンジとアンバーは特集やバッジ、セクション見出しのハイライトに最適です。ヒント:オレンジは小面積に留め、食欲をそそりつつ強調しすぎないようにしましょう。
media.io を使用して生成された夕日桟橋の画像例
10)インクとシーフォーム

HEX: #0B132B #1C7CA9 #5BC8AF #F0F7F4 #3A506B
雰囲気:ムーディー、モダン、オーシャンティック
おすすめ用途:ポッドキャストカバーアートと音楽ブランディング
ムーディーでモダン、この色調は深いインク、海のしぶき、夜の海岸の空気を連想させます。ほぼブラックネイビーを背景にしてブルーを際立たせ、シーフォームで小さなハイライトやアイコンを加えましょう。淡いミントホワイトはタイポグラフィブロックや余白に最適です。ヒント:サムネイルサイズのフォーカルポイントを作るため、シーフォームで大胆なタイポグラフィ要素を一つ加えてみてください。
media.io を使用して生成されたインクとシーフォームの画像例
11)地中海タイル

HEX: #007BA7 #00B4D8 #90E0EF #CAF0F8 #03045E
雰囲気:日差し、パターン、コースタルシック
おすすめ用途:パターンデザインとホームデコールのモックアップ
日差しとパターン、このセットはペイントタイル、白壁、港の澄んだ水を感じさせます。最も淡いブルーを背景にして、中間や明るいブルーで繰り返しのモチーフを作ります。深いインディゴは輪郭にぴったりで、パターンを小さいスケールでもシャープに保ちます。ヒント:モチーフごとにブルーを2色に絞り、他の色は交互の枠バンドとして使うと、心地よいリズムになります。
media.io を使用して生成された地中海タイルの画像例
12)キッズ学習アプリ

HEX: #1E96FC #007BA7 #FFD23F #FF6F91 #F7F7FF
雰囲気:フレンドリー、明るい、遊び心
おすすめ用途:教育アプリのUIとオンボーディング画面
フレンドリーで明るいこのカラーは、ステッカーや報酬、楽しい教室ポスターの雰囲気です。ほぼホワイトを柔らかい土台にして、ブルー2色をナビゲーションやカードの整理に使いましょう。イエローとピンクは報酬や進捗状態、遊び心のあるイラスト用に。ヒント:ピンクは1つの要素タイプ(バッジなど)のみにして、インターフェースをスキャンしやすく。
media.io を使用して生成されたキッズ学習アプリの画像例
13)ラグジュアリースパパッケージ

HEX: #0E7C86 #7BC6C9 #E9F5F5 #D8C3A5 #2E2E2E
雰囲気:穏やか、プレミアム、回復的
おすすめ用途:スキンケアラベルと商品広告
穏やかでプレミアム、この色調はスチーム、清潔なタオル、静かなスパ照明を連想させます。淡いアクアをラベルのベースにして、深いティールをブランドマークや重要な主張に使いましょう。暖かいベージュは微妙な高級感を追加します、特に箔押しアクセントやキャップに。ヒント:文字はほとんどチャコールに、ティールは控えめにして、パッケージが落ち着いた印象になり過ぎないように。
media.io を使用して生成されたラグジュアリースパパッケージの画像例
14)エディトリアル・ブルーノート

HEX: #0A2239 #006D9C #5AA9E6 #F9F7F3 #A9927D
雰囲気:洗練、編集、モダンクラシック
おすすめ用途:雑誌レイアウトとレポート
洗練され編集的、この色彩はテクスチャ紙へのインクとシャープなブルー見出しを感じさせます。暖かいオフホワイトをページ背景にし、濃いブルーでグリッドやルール、セクションヘッダーを定義します。ソフトタンは引用や小さなコールアウトボックスに最適で、目立ちすぎません。ヒント:イメージはトーンをクールに保ち、ブルーと調和させて暖色との衝突を避けましょう。
media.io を使用して生成されたエディトリアル・ブルーノートの画像例
15)ウィンターハーバー

HEX: #0B3954 #007BA7 #BFD7EA #E1E5F2 #4A4E69
雰囲気:クール、静か、熟考的
おすすめ用途:プレゼンテーションデッキとフィンテックブランディング
クールで静かなこのセットは曇り冬空の下の穏やかな水面を連想させます。淡いラベンダーとライトブルーをスライド背景に使い、内容を呼吸しやすく保ちます。深い港の色調は見出しやチャート、自信あるナビ要素に最適です。ヒント:中間ブルーはデータのハイライトにのみ使い、トレンドや主要数値が即座にはっきり分かるように。
media.io を使用して生成されたウィンターハーバーの画像例
16)レトロサーフ

HEX: #008ECF #00C2D1 #FEE440 #FF5C8A #2D3047
雰囲気:大胆、楽しい、スポーティー
おすすめ用途:ストリートウェアグラフィックとポスター
大胆で楽しいこの組み合わせはネオンワックス、サーフステッカー、賑やかな夏のサウンドトラックのようです。セリュリアンの組み合わせはダークスレートを背景にすると明るさがコントロールされます。ハイライトにはイエロー、ロゴスタンプなどワンポイントにはピンクを使いましょう。ヒント:ハーフトーンドットや太い輪郭で、高エネルギーカラーも設計された印象に。
media.io を使用して生成されたレトロサーフの画像例
17)ソフトウェディングインビテーション

HEX: #2A9BCB #BEE9E8 #F6E8EA #FDE2E4 #5E6472
雰囲気:ロマンティック、エアリー、繊細
おすすめ用途:ウェディング招待状とイベントステーショナリー
ロマンティックでエアリー、この色調は水彩のにじみ、シルクリボン、明るい春の会場を感じさせます。ブラッシュとソフトミントで紙の雰囲気を作り、ブルーはモノグラムや枠、花柄細部に。控えめなグレーで文字を上品に読みやすくし、コントラストを強くしすぎません。ヒント:ブルーは細いラインや見出しだけにして、招待状がソフトでタイムレスな印象になるように。
media.io を使用して生成されたソフトウェディングインビテーションの画像例
18)建築レンダー

HEX: #0F4C5C #1B98E0 #E8F1F2 #C5D0D6 #2D3142
雰囲気:構造的、モダン、プロフェッショナル
おすすめ用途:建築ポートフォリオとケーススタディ
構造的でモダン、このセットは明るいコンクリート上の設計図のラインを感じさせます。ライトクールグレーで余白をたっぷりとり、鮮やかなブルーで主要情報やプロジェクト指標を強調します。深いスレートは見出し、キャプション、区切りに最適。ヒント:鮮やかなアクセントはリンクやハイライトに一貫して使い、システムのようなブランド印象に。
media.io を使用して生成された建築レンダーの画像例
19)エスプレッソとアズール

HEX: #2B1D0E #6F4E37 #007BA7 #E6E1D6 #1F2937
雰囲気:居心地、落ち着き、モダンカフェ
おすすめ用途:コーヒーパッケージとカフェブランディング
居心地よく落ち着いた色調は、エスプレッソのクレマやダークウッド、ブルー陶器のアクセントを想起させます。セリュリアンの組み合わせは、暖かいブラウンが主役、ブルーがシグネチャーアクセントになると最も効果的です。ソフトオートはラベルやメニューに使い、全体を親しみやすく読みやすくします。ヒント:ブルーはシールやストライプなど繰り返し使う要素に絞り、ブランドの認知度を上げましょう。
media.io を使用して生成されたエスプレッソとアズールの画像例
20)ネオンアーケードブルー

HEX: #001845 #007BA7 #00F5FF #F72585 #B5179E
雰囲気:エレクトリック、未来的、ナイトライフ
おすすめ用途:音楽フライヤーとゲームプロモーション
エレクトリックで未来的、このパレットはアーケードの輝き、レーザーライト、真夜中のエネルギーを感じさせます。深いネイビーをステージにし、明るいシアンやセリュリアンで輝くグラデーションやUI風ラインを重ねましょう。マゼンタやバイオレットはタイトルや重要な日付などハイインパクトなアクセントに最適。ヒント:暗い余白を十分にとって、ネオンカラーが鮮明で圧倒的にならずに保たれます。
media.io を使用して生成されたネオンアーケードブルーの画像例
セルリアンと相性の良い色は?
セリュリアンは、ソフトホワイトやクールグレー、チャコールのようなクリーンなニュートラルと自然に組み合わせることで、ウェブやUIでもモダンで読みやすい印象になります。より高級感を目指す場合は、セリュリアンと暖かいニュートラル(サンド、オート、タン、アンティークブラススタイルのメタリック)を組み合わせてみましょう。
コントラストをつけたい場合は、補色やその近似色(コーラル、ピーチ、ウォームオレンジ)を使うと、ブルーと対照的な即座のエネルギーが生まれます。より明るく未来的な方向性が欲しい場合は、セリュリアンとネオンシアンのアクセント、マゼンタやバイオレットを少量加えてみてください。
自然志向のパレットには、リーフやハーブグリーン(セージからフレッシュライムまで)を追加し、最も暗い色はテキストや輪郭専用にして明瞭さを保ちましょう。
実際のデザインでセルリアンカラーパレットを使う方法
まず役割を割り当てましょう:セリュリアン1色をブランドアンカー(ナビゲーション、ヘッダー、主要形状)、ライトトーン1色を背景、ダークニュートラル1色を文字に。この方法で「オールブルー」レイアウトが平面的にならずに階層が維持されます。
UIではセリュリアンを主要アクションやインタラクティブステートに使いつつ、ネオン系シアンは1用途(選択タブ、アクティブチャートライン、CTAなど)に絞り、注意が分散しないように。印刷ではペーパーのストックでセリュリアンをテストし、やや濃いブルーの方が未加工紙でコントラストを保持しやすいです。
暖色アクセント(コーラル、アンバー、ブラスなど)と組み合わせるときはアクセントを小さく予測可能に繰り返し使いましょう — バッジ、タグ、アイコンのように — 意図的な構成と感じさせ、騒がしさを防ぎます。
AIでセルリアンパレットビジュアルを作成する
HEXコードが手元にあって実際のビジュアル(ヒーローバナー、ポスター、パッケージモックアップ、UI画面など)が欲しい場合は、AIでコンセプト作成を素早く行えます。重要なのは、レイアウトやスタイル、各セリュリアン色がどこに使われるか(背景、ボタン、輪郭、ハイライト)をしっかり記述することです。
ユースケースごとにプロンプトは1つずつ、カラーの役割を一貫させましょう — 特に明るいシアンや暖色アクセントは — 結果がきちんと設計された印象になります。気分やフォーマット(1:1、16:9、9:16)だけ変更してパレットは固定すれば、素早く反復できます。
セリュリアンパレット画像を数秒で生成し、お気に入りの方向性を繰り返しブランドシステムに昇華していきましょう。
セリュリアンカラーパレット:よくある質問
-
セリュリアンのHEXコードは何ですか?
セリュリアンは一般的に#007BA7で表現されます。実際のプロジェクトでは「セリュリアン」はブランドや画面、印刷プロファイルによって多少異なる場合があります。 -
セリュリアンは暖色ですか、寒色ですか?
セリュリアンは寒色系のブルーで、クリーンでややグリーン寄り(シアン系)のさわやかさがあります。空気感、モダン、落ち着いた印象を与える傾向です。 -
セリュリアンに最も合う色は何ですか?
暖色系アクセントはコーラル、ピーチ、アンバー、オレンジ セルリアンと美しく対照的です。よりミニマルな印象にしたい場合は、オフホワイト、クールグレー、チャコール. -
セルリアンの背景で最も読みやすいテキストカラーは何ですか?
読みやすさを重視するなら、とても暗いニュートラルカラー(チャコール or ディープネイビー)を使い、白はセルリアンが十分に暗い場合のみコントラストを保つために使います。 -
セルリアンのパレットが「クリニカル」な印象にならないようにするには?
暖かみのあるニュートラル(サンド、オートミール、タン)ややわらかいアクセント(ブラッシュ、バターイエロー)を加えましょう。また、純粋な黒の代わりにチャコールを使い、白の余白を広く取ることもおすすめです。 -
セルリアンは高級ブランディングに使えますか?
はい。セルリアンは落ち着いたニュートラルカラーや金属のような暖色トーン(ベージュ、タン、アンティークブラス)と組み合わせ、控えめなアクセントや洗練されたタイポグラフィと合わせることで、上質さを感じさせます。 -
ひとつのデザインにセルリアンパレットから何色使えばいいですか?
おすすめは3〜5色です:メインのセルリアン1色、明るい背景1色、暗いテキストカラー1色、アクセント1〜2色。これでデザインがまとまり、見やすくなります。

