青系の色一覧と名前の由来まとめ|伝統色から配色コードまで徹底解剖
空や海原の広がりを象徴し、人類の歴史の中で知性、誠実、そして神秘の象徴として愛され続けてきた「青」。ひと口に青といっても、武士の覚悟を宿す深く沈んだ藍色から、宝石ラピスラズリの煌めきを湛えた瑠璃色、江戸の街を彩った浅葱色、西洋絵画の革新をもたらしたコバルトブルーまで、そのニュアンスは驚くほど多彩です。しかし、デザインやWeb制作、空間設計の現場において「どの青を選べば意図した印象を正確に伝えられるのか」という問いは、プロの間でも常に議論の的となってきました。
色彩のわずかな明度・彩度の違いは、人間の心理や意思決定に直結します。本稿では、JIS慣用色名や知覚心理学の最新データを基に、日本の伝統色からデジタルの青系カラーコード一覧、意外と知られていない名前の由来や「紺色と藍色の決定的な違い」に至るまで、第一線のクリエイティブ視点から詳細に紐解きます。
📌 【この記事の重要ポイントまとめ】
- 要点1:青系の色は鉱物由来・植物染料由来・化学合成由来に大別され、それぞれが固有の歴史的背景とカラーコード(HEX値)を持つ。
- 要点2:混同されがちな「紺色」と「藍色」は、染色工程の回数と赤みの含有量(色相・トーン)において明確な差異が存在する。
- 要点3:青の色彩心理は副交感神経を刺激して鎮静や信頼を生む一方、明度や面積比を誤ると冷淡さや拒絶感を生むため綿密な配色設計が不可欠である。
【2026年最新】青系の色一覧とカラーコード|日本の伝統色から洋名まで網羅
デジタルデバイスの表示性能向上に伴い、カラーマネジメントの現場では「青」の微細な階調表現がより厳密に求められるようになっています。日本の伝統的な青は、四季の移ろいや自然の動植物、貴石から名付けられたものが多く、曖昧で情緒的な美しさを宿しています。一方、西洋の青は顔料の化学組成や原産地に由来する論理的な命名が際立ちます。
ここでは、Webデザインやグラフィック制作の実務ですぐに活用できるよう、主要な青系の色名、読み仮名、16進数カラーコード(HEX)、RGB値、そしてその色を特徴づける背景情報を一覧表にまとめました。
| 色名(和名・洋名) | カラーコード(HEX / RGB) | 由来・歴史的分類 | 編集部の見解・適した用途 |
|---|---|---|---|
| 瑠璃色(るりいろ) | #1e50a2 (30, 80, 162) | 仏教の七宝「瑠璃(ラピスラズリ)」に由来する深青 | 高貴で神秘的。高級ブランドや格式高い式典キービジュアルに最適 |
| 藍色(あいいろ) | #165e83 (22, 94, 131) | 植物のタデアイで染めた日本を代表する伝統色(Japan Blue) | 素朴さと力強さが共存。伝統工芸やコーポレートアイデンティティに盤石 |
| 浅葱色(あさぎいろ) | #00a3af (0, 163, 175) | 薄い葱(ねぎ)の葉の色。新選組のだんだら羽織で著名 | 清涼感と鋭さ。アクセントカラーや観光・地域創生メディアで映える |
| 群青色(ぐんじょういろ) | #4c6cb3 (76, 108, 179) | 鉱石アズライト(藍銅鉱)を砕いて精製した岩絵の具の最高峰 | 鮮明で純度が高い。日本画のみならず現代UIのプライマリボタンにも機能 |
| コバルトブルー | #0068b7 (0, 104, 183) | 酸化コバルトとアルミナを焼成した19世紀初頭の合成無機顔料 | 濁りのない純粋な青。澄み切った空・海の表現やテクノロジー系サイトに合致 |
| 紺色(こんいろ) | #223a70 (34, 58, 112) | 藍染めを極限まで重ねた濃密な青。平安期以降の格式色 | 知性・規律・信頼。金融機関、公的機関、スーツの基準色として不動 |
上記の数値は日本産業規格(JIS Z 8102)の慣用色名規格や、一般的なデザインツールで標準とされるsRGBプロファイルに準拠しています。画面環境によって見え方が変化するため、実際のプロダクト選定では紙面や実物見本帳(DICやPANTONE)と照合することが不可欠です。

意外と知らない名前の由来|鉱石・植物・身分制度が織りなす青の歴史
日本における青の歴史を辿ると、単なる「視覚的な記号」ではなく、当時の階級秩序や入手困難な交易品、染色技術の限界と深く結びついていた事実が浮かび上がります。
仏教の聖典において薬師如来の浄土「瑠璃光浄土」を象徴する瑠璃色は、古代ペルシャやアフガニスタンからシルクロードを経由して日本へもたらされた貴石「ラピスラズリ」が源流です。正倉院の宝物「瑠璃坏(るりのつき)」に見られる通り、かつて瑠璃は金銀に匹敵する価値を持ち、庶民が身につけることなど許されない特権階級の祈りの色でした。
一方、庶民の生活に根づいたのが藍色です。江戸幕府が発令した「奢侈禁止令(しゃしきんしれい)」により、町民や農民は絹や華美な色使いを厳しく制限されました。その制限下で重宝されたのが、安価で防虫・抗菌作用に優れたタデアイ(蓼藍)です。職人たちは染めの回数を変えることで、薄い「瓶覗(かめのぞき)」から、浅葱色、縹色(はなだいろ)、そして濃紺に至るまで数十段階の青を生み出し、これを「藍四十八色」と呼んで粋を競い合いました。
幕末に京都の治安維持を担った新選組の隊服として名高い浅葱色は、ネギの若芽のようなわずかに緑がかった明るい青を指します。江戸時代初期、浅葱色は武士の切腹の際の裃(かみしも)に用いられた色でもあり、新選組の隊士たちがこの色を採用した背景には「常に死を覚悟して任務に当たる」という悲壮な決意が込められていたと伝えられています。
一般に知られていない盲点とネットの誤解|「紺色と藍色」の決定的な違い
ネット上のQ&AサイトやSNSで最も頻繁に見られる疑問が、「紺色と藍色は何が違うのか」という問題です。「単なる言い換え」「藍色の英語がネイビー(紺)なのでは」といった誤った解釈が流布していますが、色彩学および染色文化の観点から見ると、両者には明確な差異が存在します。
決定的な違いは、「染料の重ね具合と色相(赤みの有無)」にあります。
藍色はタデアイを用いて染めた青の総称であると同時に、やや黄み・緑みを帯びた中間的なトーン(明度40〜50%前後)の青を指します。これに対し、紺色は藍染めの中でも「極めて濃く染め重ねた色」です。職人が藍甕(あいがめ)に布を十数回から数十回浸し、酸化発色を繰り返すことで、青の深淵とも言える暗さ(明度20〜30%程度)へと到達させます。
さらに、伝統的な紺染めの工程では、藍の青さに深みと落ち着きを与えるため、下染めに「茜(あかね)」や「蘇芳(すおう)」といった植物染料を用い、わずかに赤みを忍ばせることが行われてきました。現代のデジタル表色系においても、紺色(#223a70など)は藍色(#165e83など)と比較してブルーの中にわずかなレッド成分が強くブレンドされており、重厚感と凛とした佇まいを醸成しています。

【色彩心理と効果】青が心身に与える影響|鎮静作用からUI設計の信頼構築まで
青は、可視光線の中でも波長が比較的短い光(約450〜495nm)に属します。知覚心理学および生理心理学の研究データによると、人間が青色の光や空間に身を置いた際、視床下部を通じて自律神経系に信号が送られ、副交感神経が優位になることが実証されています。
具体的には、以下のような生体反応および心理的効果が報告されています。
- 心拍数・脈拍の安定:短波長の光は興奮物質のアドレナリン分泌を抑制し、血圧や呼吸数を落ち着かせる傾向がある。
- 時間の心理的短縮:寒色系の空間では、体感時間が実際よりも短く感じられる「時間過小評価」が起き、待合室や作業スペースでのストレス低減に寄与する。
- 心理的バウンダリー(境界線)の構築:青は内省を促し、他者との過度な感情的同一化を防いで理性的・論理的な判断を維持するメンタルスペースを確保させる。
この心理的安全性と論理性を背景に、世界の主要テック企業やメガバンク、保険会社はコーポレートカラーやUIのキートーンに青を採用しています。Meta(旧Facebook)、PayPal、各都市銀行のインターフェースが青を基調としているのは、ユーザーに「詐欺への警戒心を解く信頼感」と「トランザクションを正確に行う冷静さ」を同時に付与するためです。
一方で、青には「食欲減退効果」と「冷淡・孤立の誘発」という二面性があります。自然界の食物において「鮮やかな純青」を持つ食材が極めて稀であるため、人間の原始的本能は青い食べ物を「腐敗」や「毒」と直感します。飲食店のブランディングや食品パッケージにおいて、安易に広い面積で青を使いすぎると、売上に重大な悪影響を及ぼすリスクがあるため注意が必要です。
【実践プロ解説】青色配色見本と失敗しないトーンオントーンの原則
デザイン制作やインテリア、日々のスタイリングにおいて、青を美しく調和させるためには「彩度(鮮やかさ)と明度(明るさ)のコントロール」が成否を分けます。プロが現場で常用する代表的な青の配色パターンを整理しました。
1. トーンオントーン配色(同系色の濃淡)
ベースカラーに「淡い水色(#bce2e8)」、メインに「コバルトブルー(#0068b7)」、引き締めのアクセントに「濃紺(#182a4d)」を配置する構成です。色相が同一であるため視覚的なノイズが極めて少なく、洗練された清潔感と論理的秩序を演出できます。ITプロダクトのダッシュボードやビジネス文書に最も適した安全な手法です。
2. 補色対比配色(青 × オレンジ・ゴールド)
色相環の正反対に位置するオレンジやアンバー(琥珀色)を青と衝突させる手法です。「深い群青色(#4c6cb3)」の背景に対し、アクションボタンや重要通知に「温かみのあるオレンジ(#ea5514)」を乗せることで、視認性とクリックスルー率(CTR)を最大化できます。ただし、両者の明度・彩度を最高値でぶつけ合うと「ハレーション(目がチカチカする現象)」を引き起こすため、どちらか一方の彩度を抑えるのが鉄則です。
【プロの結論】青を最大限に活かせる人・慎重になるべき人の判断基準
青という色は万能に見えて、極めて強いメッセージ性を持っています。採用にあたっては、以下の基準に照らして判断することが推奨されます。
【青の採用を強く推奨するケース】
- 専門性、論理性、法令遵守、高セキュリティを約束しなければならないBtoBサービス
- 寝室や書斎、長時間のデスクワークを前提とした集中環境の空間デザイン
- 夏期商戦の清涼飲料水、制汗剤、冷感ファブリックなど、視覚的涼感を訴求する商品
【青の選定に極めて慎重になるべきケース】
- 「焼きたて」「温もり」「家庭的な親しみ」をコアバリューとする飲食店や惣菜ブランド
- 共感や感情の爆発的共有(エモーショナルな熱狂)を狙うエンタメ系ファンコミュニティ
- 高齢者向けの視覚デザイン(加齢に伴う水晶体の黄変により、暗い青と黒の区別が著しく困難になるため)

【実態検証】クリエイターの生の声と現場目線で見えたリアル
実際にWeb制作会社やアパレルメーカーの現場を取材すると、デジタル画面上の青と現実のフィジカルな青とのギャップに苦しむクリエイターの生々しい声が数多く聞かれます。
都内の大手Web制作プロダクションでアートディレクターを務める30代男性は、近年のデザイントレンドについて次のように語ります。
「2024年から2026年にかけて、有機EL(OLED)ディスプレイが標準化したことで、かつてのWebセーフカラーのような彩度の高い青(#0000FFなど)を画面全体にベタ塗りすると、ユーザーから『眩しすぎて目が痛い』『長時間滞在できない』というクレームが顕著に増えました。現在、現場ではわずかにグレーを混ぜたスモーキーな藍色や、ペールトーンのサックスブルーへ移行させる案件が全体の6割を超えています」
また、アパレルのOEM生産を手掛ける老舗繊維商社の染色担当者は、実世界における「紺色」の選定ミスについてこう警告します。
「お客様から『黒に近い濃紺で』とオーダーされて納品したスーツが、蛍光灯の下で見ると黒に見え、屋外の太陽光の下に出ると赤紫色に転んで見えてしまい、トラブルになるケースが絶えません。青系の染料は光のスペクトルに極めて敏感です。オフィス環境のLED光と自然光の両方でサンプルを照らし合わせる工程を省いたことで生じる失敗事例は、後を絶ちません」
ネット上の情報だけを鵜呑みにして「カラーコードの数値が合っていれば問題ない」と過信することは、プロの現場では致命傷になり得ます。メディアの媒体特性(液晶画面か、印刷インキか、布地か)を理解し、環境光による変化まで計算に入れることこそが、青を美しくコントロールするための本質です。
【青系の色】に関するよくある質問(FAQ)
Q1:日本の伝統色の中で、最も歴史が古い青は何ですか?
A1:文献上、最も古くから確認できるのは「縹色(はなだいろ)」です。飛鳥時代の「冠位十二階」や奈良時代の朝服において、藍染めの濃淡を示す基準として用いられました。当時は植物のツユクサ(露草)の花弁を布に擦り付けて染める「花摺り(はなずり)」に由来し、のちに藍染めへと移行していきました。
Q2:Webデザインで誰にでも見やすく、アクセシビリティに優れた青のコードは?
A2:白背景に対して十分なコントラスト比(WCAG基準4.5:1以上)を確保できる「#1e50a2(瑠璃色)」や「#005bac(コバルト系ディープブルー)」が推奨されます。明るすぎるスカイブルー(#00bfffなど)を本文テキストや細いアイコンに使用すると、弱視の方や高齢者が視認できなくなるため、必ず背景との明度差を確認してください。
Q3:なぜ世界中の国旗や制服に「青(ネイビー)」が多く使われているのですか?
A3:大航海時代以降、イギリス海軍(ロイヤルネイビー)が1748年に濃紺の制服を公式採用したことが決定打となりました。耐久性があり汚れが目立ちにくく、洋上で際立つ威厳と規律を体現したことから、各国の海軍や警察官、パイロットの制服へと波及しました。国家の規律、正義、平和の象徴として、世界中で最も信頼される色として定着した歴史的背景があります。
まとめ:青の深奥を理解し表現の解像度を高める
青系の色は、空の広大さや海の深さをそのまま映し出したかのように、無限の広がりと奥行きを秘めています。古代の祈りを乗せた瑠璃色から、庶民の知恵と粋が結晶した藍色、そしてデジタルの光として現代社会を支えるヘックスコードに至るまで、それぞれの色には固有の文脈と役割が刻まれています。
デザインや日常の選択において青を扱う際は、単に「爽やかだから」「無難だから」という理由で選ぶのではなく、その青が持つ彩度・明度、歴史的背景、そして受け手の心理に引き起こす生理的反応まで意識を向けてみてください。色の解像度を高めることは、自らの思考や表現の解像度を高めることに他なりません。 (出典: 青 系 の 色(Yahoo!ニュース))