海の色は、透明感・広がり・落ち着きを同時に表現できる配色です。
この記事では、
をまとめてご紹介いたします。
背景・イラスト・SNS画像・装飾などの参考にもおすすめです。
海グラデーションのシンプルな考え方

海グラデーションでは、上(浅瀬)を明るく、下(深海)を暗くするのが基本です。
配色理論を考えなくても、
浅い水色 → 青 → 深い青
この流れを作るだけで、自然と海らしくなります。
青に少しだけ緑を混ぜると、より透明感のある海になります。
海グラデーション配色パターン集
ここからは、海グラデーション配色パターン集を7つご紹介していきます。
モニター環境や印刷条件によって、実際の色味とは多少異なって見える場合があります。
あくまで参考値としてご活用ください。
①透明な浅瀬の海
B L U E S E A
透明度の高い、さわやかな浅瀬の海グラデーション。
背景・夏向けデザイン・Webビジュアルにおすすめです。
| カラー | カラーコード | RGB |
| アクアブルー | # | 79, 195, 247 |
| ライトアクア | # | 157, 236, 249 |
| シークリア | # | 224, 247, 250 |
②南国の海(エメラルド)
B L U E S E A
南国リゾートの、美しいエメラルドグリーンの海グラデーション。
旅行・観光・リゾート系にぴったりです。
| カラー | カラーコード | RGB |
| トロピカルブルー | # | 45, 212, 191 |
| エメラルド | # | 94, 234, 212 |
| パールブルー | # | 230, 255, 250 |
③オーシャンブルー
B L U E S E A
王道の美しいオーシャンブルー。
Web・資料・ブランド系など、使いやすいデザインです。
| カラー | カラーコード | RGB |
| シーブルー | # | 14, 165, 233 |
| オーシャンブルー | # | 56, 189, 248 |
| スカイブルー | # | 186, 230, 253 |
④深海ブルー
B L U E S E A
深い海の底をイメージした、神秘的な深海グラデーション。
アート・夜系ビジュアル・物語背景などと、相性が良いです。
| カラー | カラーコード | RGB |
| ディープシー | # | 2, 6, 23 |
| ディープブルー | # | 30, 64, 175 |
| ダスティブルー | # | 100, 116, 13 |
⑤波打ち際(やさしい)
B L U E S E A
穏やかな波打ち際の、癒し系海グラデーション。
ナチュラル系・SNS画像・装飾背景などに◎。
| カラー | カラーコード | RGB |
| ソフトブルー | # | 147, 197, 253 |
| ペールブルー | # | 224, 242, 254 |
| フォームホワイト | # | 255, 255, 255 |
⑥大海原
B L U E S E A
広い大海原をイメージした、海グラデーション。
Web・背景・読み物系にも使えます。
| カラー | カラーコード | RGB |
| ディープネイビー | #0C508D | 12, 80, 141 |
| シアンブルー | #3192DA | 49, 146, 218 |
| ライトブルー | #C3DDF2 | 195, 221, 242 |
⑦水面が輝く海
B L U E S E A
太陽が反射する、美しくきらめく海グラデーション。
旅行・夏向けデザイン・リゾート系に。
| カラー | カラーコード | RGB |
| ビーチブルー | #0CA2C0 | 12, 162, 192 |
| マリンブルー | #33CCC9 | 51, 204, 201 |
| アクアブルー | #B9F3F5 | 185, 243, 245 |
海グラデーションで気にしなくていいこと

海グラデーションでは、以下のことは考える必要ありません。
「海っぽいかどうか」だけで判断して大丈夫です。
まとめ
海グラデーションは、明るさの差をつけるだけで成立する配色です。
浅瀬は明るく、沖に向かって暗く、緑を少しプラスする。
この3つで、誰でも自然な海が作れちゃいます。


コメント