シティポップの世界観といえば、夜の街、ネオン、海沿いのドライブ。
少し大人で、どこか切ない空気感が魅力です。
その雰囲気を一瞬で伝えるのが、独特の配色バランスです。
この記事では、
をまとめてご紹介。
イラスト・ジャケット風デザイン・SNS・バナーの配色の参考にもおすすめです。
シティポップ配色の特徴とは?

シティポップ配色は、1980年代の日本×都会×夜がベース。
青・紫・ピンク・ネオンカラーなど一見派手に見える色も、組み合わせ次第で 都会的で洗練された印象になります。
シティポップ配色の基本ルール

シティポップを再現するためには、以下のルールを抑えておけばOK!
シティポップ配色パターン集(3色)
ここからは、シティポップの配色を5つご紹介していきます。
モニター環境や印刷条件によって、色味が多少異なって見える場合があります。
あくまで参考値としてご活用ください。
①王道|ネイビー×ピンク

シティポップの定番は、夜の街をイメージした配色です。
| カラー | カラーコード | RGB |
| メイン | #1F2A44 | 31, 42, 68 |
| サブ | #FF5C8A | 255, 92, 138 |
| アクセント | #8A7FFF | 138, 127, 255 |
②海沿い|ブルー×ターコイズ

海沿いをイメージした配色で、アクセントにスポーツカーの赤を入れても◎
| カラー | カラーコード | RGB |
| メイン | #0B3C5D | 11, 60, 93 |
| サブ | #2EC4B6 | 46, 196, 182 |
| アクセント | #FFFFFF | 255, 255, 255 |
③ネオン街|紫×シアン

ネオンの街並みっぽさを演出した、レトロなのにどこか新しい組み合わせです。
| カラー | カラーコード | RGB |
| メイン | #5B3F78 | 91, 63, 120 |
| サブ | #00C2D1 | 0, 194, 209 |
| アクセント | #F67FDF | 246, 127, 223 |
④サンセット|オレンジ×ピンク

ノスタルジックなサンセットカラーの配色です。
| カラー | カラーコード | RGB |
| メイン | #FF9652 | 255, 150, 82 |
| サブ | #FF487C | 255, 72, 124 |
| アクセント | #2B2E4A | 43, 46, 74 |
⑤大人|グレー×ブルー×ネオン

ちょっとダンディな大人のイメージの、ネオン感強めのシティポップです。
| カラー | カラーコード | RGB |
| メイン | #2E2E2E | 46, 46, 46 |
| サブ | #3A7CA5 | 58, 124, 165 |
| アクセント | #F7FF00 | 247, 255, 0 |
シティポップ配色の黄金比

シティポップ配色では、「色の割合」がとても重要です。
この比率を意識するだけで、配色のバランスが一気に良くなります。
ネオンは「少量」で一気に雰囲気がでてきますよ。
シティポップ配色のNG例

シティポップ風にしたいのに、なんだか違う気がする…そんなときは、
以上のことに注意して、配色を考えて見ましょう。
まとめ|シティポップ配色を成功させるコツ
シティポップ配色は、
この3点を押さえれば、一気に「シティポップらしさ」が完成!!
今回紹介した配色パターンは、イラスト・ジャケット風デザイン・SNS・バナーまで幅広く使えるので、ぜひ保存して活用してみてくださいね。



コメント