ミッドナイト
デザインの雰囲気は、色や質感の組み合わせで大きく変わる。
ミッドナイト*midnightは、静かで深みのある夜の印象を持つスタイル。
意味・特徴
このスタイルの意味や印象、デザイン全体に広がる雰囲気から特徴を読み解く。
真夜中
静かで深みのある夜の雰囲気を演出する
幻想的で落ち着いた印象を与える
配色のバランス
このスタイルを形づくる代表的な色と、それぞれが与える印象の関係から全体像を捉える。
#191970 ミッドナイトブルー
#000080 ネイビーブルー
#0A0A0A ジェットブラック
#4B0082 バイオレットナイト
#71706E ダークシルバー
ライトイエロー
アプリコット
ライムグリーン
明度が高く軽快な色は、ミッドナイト特有の静寂感や深みを弱めやすい。そのため、夜らしい落ち着きや神秘性が感じられにくくなる。
低
静かで神秘的な印象を与える
深みのある雰囲気を演出する
低
落ち着いた夜の印象を与える
幻想的で奥行きのある雰囲気を演出する
配色と展開
配色の考え方を起点に、実際の使われ方やデザインへの広がりへとつながる。
トーン
夜の静けさと深みを感じさせるダークで幻想的な色調。
ベースカラー
ブラック、ミッドナイトブルー、ディープパープルを使用する。
サブカラー
ダークグレーやインディゴで奥行きを加える。
アクセントカラー
シルバーや微かなネオン光で神秘性を強調する。
素材・質感
ベルベットやサテンなど光を吸収する深い質感を使用する。
活用シーン
・バー・ナイトスポット
・音楽・クラブイベント
・ファッション
・エンターテインメント
・高級商材
など
活用例
・ポスター・フライヤー
・Webサイト・特設サイト
・広告バナー・SNS広告
・ブランドビジュアル
・販促・プロモーション素材
など
関連キーワード
ミッドナイトに関連する「20」のキーワードをもとに、それぞれの雰囲気を際立たせる3色の配色パターンを一覧で紹介。
同じテーマでも、連想されるイメージは人によって異なる。似た意味を持つキーワードであっても、選ぶ言葉によって微妙に異なる雰囲気や世界観を表現できる。
ぜひ、ご自身のイメージに近いキーワードを探しながら、用途やデザインに合わせてブラッシュアップ*brush up
/ 既にあるものを磨き上げてさらに良いものにすることし、配色選びの参考にしてください。
基本の配色テクニック
ここに記している配色は、個人的な見解で組み合わせたものです。配色のバランスによって印象は大きく変わるため、すべてのデザインに当てはまるとは限りません。
トライアド*triadとは、色相環上で正三角形を描く位置にある3色配色。
「トライアド」とは、音楽の三和音*3つの音が3度ずつ積み重ねられてできた和音（コード）のことに由来する名称で、変化がありながらもバランスが良く、安定感と華やかさを兼ね備えた配色となる。
スプリット・コンプリメンタリー*split complementary
分離補色とは、補色の片方を隣接色に分離した3色配色。
スプリットとは、「分割する・分離する」を意味し、補色配色よりもコントラストをやわらげつつ、配色に変化とバランスを与えられる。
トーン・オン・トーン*tone on toneとは、「トーンを重ねる」を意味し、同じ色相や隣接した色相で全体をまとめ、明度差を大きくした多色配色。
色相の印象を強調しつつ統一感を保ち、明度差によって変化をつけられるため、バランスがとりやすく穏やかな印象になる。また、明度差を活かすことで立体的な効果を演出することも可能である。
また、3色の配色は「どの色を主役にするか」「どの順で配置するか」によって印象が大きく変わる。
同じ3色でも、主役となる色を明るく見せるか、あるいは背景として引き立てるかによって、全体の雰囲気は華やかにも落ち着いた印象にも変化する。
そのため、色の配置順や面積バランスを入れ替えながら、最も意図に合った見え方を調整することが重要である。
ベースカラー
#D9D9D9
アクセントカラー
#FF6B6B
サブカラー
#7FB3FF
ベースカラー
#FF6B6B
アクセントカラー
#7FB3FF
サブカラー
#D9D9D9
ベースカラー
#7FB3FF
アクセントカラー
#D9D9D9
サブカラー
#FF6B6B
配色比率
配色の印象は、色の組み合わせだけでなく使用する面積比率によっても大きく変わる。一般的には「ベースカラー70％・アクセントカラー5％・サブカラー25％」を目安にすると、バランスの取れた配色にまとめやすい。
ここでは、視覚的に理解しやすいよう「ベースカラー70％・アクセントカラー10％・サブカラー20％」の比率を基準としている。
ベースカラー: 70%
背景や余白など、最も広い面積に使用する基本色。全体の雰囲気やトーンを決定づける。
#D9D9D9
アクセントカラー: 10%
視線を集めたい部分に使う強調色。ボタンや見出しなどに用い、デザイン全体を引き締める。
#FF6B6B
サブカラー: 20%
ベースカラーを補完し、全体の印象を整える補助色。デザインに奥行きや安定感を与える。
#7FB3FF
シティミッドナイト
都市の夜景に広がる光と影を切り取った、都会的で洗練されたナイトスタイルを表現した配色。
ビル群の灯りやストリートのネオンを思わせる色彩を組み合わせることで、リアルでありながらもスタイリッシュな夜の空気感を演出する。
都市
人口が密集し、政治・経済・文化の中心地としての役割を果たす地域のこと
#0F3460
#533483
#E94560
#0A1128
#1282A2
#FCA311
#020617
#1F2937
#4B5563
都市に林立する高い建築物
#0F172A
#64748B
#38BDF8
#0B1320
#F97316
#22C55E
#0B132B
#1F3A5F
#3B5B7A
夜の景色
自然光に加え、人工の光によって形成される夜間特有の景観のこと
#090A1A
#8338EC
#3A86FF
#111827
#E63946
#4EA8DE
#0A0F2C
#1F4068
#2A6F97
ネオンミッドナイト
夜の都市に瞬くネオンライトのきらめきを主役にした、エネルギッシュでポップなナイトスタイルを表現した配色。
鮮烈な発光色やコントラストの強い色彩を組み合わせることで、非現実的でアーティスティックな夜の世界観を演出する。
夜の街を彩る発光広告・人工光
#0B1020
#FF2D95
#00E5FF
#111827
#A78BFA
#F59E0B
#0A0614
#2A0F4A
#6D28D9
人と光が密集する賑やかな商業エリア
#1A0F0F
#FF3D00
#FFD000
#111111
#FF006E
#3A86FF
#120A0A
#2A1414
#4A2A2A
ダークミッドナイト
深い闇に包まれた静寂と重厚感をテーマにした、ミステリアスでシックなナイトスタイルを表現した配色。
限られた光と濃密な暗色を組み合わせることで、緊張感と奥行きのあるダークな雰囲気を演出する。
まったく光がなく暗いさま
#08090F
#1A1A2E
#5A189A
#101742
#422810
#42102E
#07070A
#1A1A22
#3A1C2E
物音ひとつなく静まり返っていること
ひっそりとして寂しいさま
#252550
#502550
#505025
#0E1428
#4F79B2
#B2A64F
#0B132B
#1C2541
#5C677D
人の活動が減り、静けさが支配する時間帯
#050816
#1E293B
#6366F1
#020617
#0EA5E9
#F97316
#020617
#0F172A
#1E293B
光がほぼ存在しない完全な暗さ
#000000
#1F2937
#7C3AED
#050505
#F43F5E
#22D3EE
#020202
#0A0A0A
#1A1A1A
音が消えたような静寂状態の比喩
#0B132B
#1C2541
#5BC0BE
#0A0F1F
#94A3B8
#F1F5F9
#0B1220
#1B263B
#334155
ルナミッドナイト
月光に照らされた夜空の柔らかな輝きをイメージした、幻想的で落ち着いたナイトスタイルを表現した配色。
淡く澄んだ光と青みを帯びた色彩を組み合わせることで、静かで神秘的な月夜の空気感を演出する。
夜空に浮かぶ天体
夜を照らす反射光
#0B1020
#E5E7EB
#A78BFA
#0A0A0A
#FDE68A
#93C5FD
#0A0F1F
#2B3A67
#E5E7EB
月のひかり
太陽光を反射して輝く月の光のこと
#1C2541
#EAEAEA
#9A8CFF
#0A0908
#EAE2B7
#FFD166
#000814
#001D3D
#003566
月の光
月明かり
空に浮かぶ月の姿や形そのもの
月の光に照らされることで現れる、人や物の影
水面などに映し出された月の光景
#0A0F2C
#2E1A47
#A3CEF1
#0F1C2E
#33415C
#EAE2B7
#0D1B2A
#1B263B
#778DA9
春の夜に月が霞んでぼんやりとかすんでいるさま
物の姿がかすんで、はっきりしないさま
#0A1128
#9A8C98
#F2E9E4
#0D1B2A
#415A77
#E0AFA0
#1B263B
#415A77
#778DA9
星や月が浮かぶ夜の空間
#020617
#1E3A8A
#38BDF8
#030712
#F59E0B
#A78BFA
#030712
#0F172A
#1E293B
ドリームミッドナイト
夢と現実の境界が溶け合うような、浮遊感と幻想性に満ちたナイトスタイルを表現した配色。
柔らかく変化する色彩や淡い光のニュアンスを組み合わせることで、儚くも美しい夢のような夜の世界を演出する。
睡眠中に見る幻想的なイメージ・願望の象徴
#0F0F1A
#A78BFA
#F472B6
#0B0F1A
#60A5FA
#FCD34D
#0B0A12
#2A1B3D
#F472B6
夢や幻
非常に儚い*はかないことのたとえ
#0A0F2C
#7209B7
#80FFDB
#0F1535
#4361EE
#FF4D6D
#0C112C
#151C45
#334FAF
半分眠っているようなぼんやりした状態
#1A1B2F
#94A3B8
#F9A8D4
#111827
#CBD5E1
#FDE68A
#111827
#1F2937
#374151
現実と非現実の境界が曖昧なイメージ世界
#0B0B2E
#8B5CF6
#22D3EE
#0A0A1A
#F472B6
#A3E635
#0A0A1A
#1A1A3A
#2E2E6E
夜に静かに物思いにふけること
#0F172A
#3B0764
#0891B2
#020617
#7C3AED
#FB7185
#050816
#1B263B
#415A77