漢青
かんせい | Han Blue
広色域(Display P3)比較
sRGB(従来のWeb標準)
#446CCF
Display P3(広色域)
color(display-p3 0.3082 0.4192 0.7811)
意味と歴史
由来
漢青(漢藍)は古代中国で開発された合成バリウム銅ケイ酸塩顔料で、化学式はBaCuSi₄O₁₀である。1993年に天然鉱物エッフェンベルジャイトとして自然界にも存在することが発見された。
歴史
西周時代(紀元前1045〜771年)のビーズに最古の使用例が確認されており、漢代(紀元220年頃)まで使用が続いた。エジプシャンブルー(CaCuSi₄O₁₀)と同じ基本構造を持つが、カルシウムの代わりにバリウムを含む点で異なる。製造には約900〜1000℃の高温と20〜48時間の長時間焼成が必要であった。
伝統的な用途
西周時代のビーズ装飾、戦国時代の八角形顔料スティック、漢代の胡形土器(灰色陶器)や青銅器の装飾、壁画の顔料として使用された。漢青と漢紫を混合することで、青から紫までの多様な色合いが作り出された。
CSSコード
HEX
#446CCF RGB
rgb(68, 108, 207) CMYK
cmyk(67.1%, 47.8%, 0%, 18.8%) HSV
hsv(222.7, 67.1%, 81.2%) OKLCH
oklch(55.44% 0.1595 265.07) Display P3
color(display-p3 0.3082 0.4192 0.7811) Munsell
7PB 4.8/12 CIE XYZ
XYZ(0.19005, 0.16457, 0.60399) CIE L*a*b*
Lab(47.57, 18.38, -54.73) CIE LCH(ab)
LCH(47.57, 57.73, 288.56°) CIE L*u*v*
Luv(47.57, -17.19, -84.74) Hunter Lab
Hunter Lab(40.57, 15.03, -64.47) xyY
xyY(0.19826, 0.17168, 0.16457) JzAzBz
JzAzBz(0.006002, -0.001425, -0.013307) JzCzHz
JzCzHz(0.006002, 0.013383, 263.89°) フォールバック付きCSS
.element {
/* sRGBフォールバック */
background-color: #446CCF;
background-color: oklch(55.44% 0.1595 265.07);
}
@media (color-gamut: p3) {
.element {
background-color: color(display-p3 0.3082 0.4192 0.7811);
}
} コントラストチェッカー
WCAG 2.1 基準に基づくコントラスト比を表示します。
白背景
4.89:1
黒背景
4.29:1
白文字
4.89:1
黒文字
4.29:1
配色シミュレーター
この色を背景やテキストに使用した場合のプレビューです。
白テキスト — The quick brown fox
黒テキスト — The quick brown fox
色の上にテキストを配置した場合の可読性を確認できます。見出し・本文・リンクなど、さまざまなサイズで試してみてください。
白背景 — 見出しテキスト
本文テキストのサンプルです。The quick brown fox jumps over the lazy dog.
黒背景 — 見出しテキスト
本文テキストのサンプルです。The quick brown fox jumps over the lazy dog.
色覚シミュレーション
P型(1型)
赤色の感度が低下
#3778D3
D型(2型)
緑色の感度が低下
#166BCD
T型(3型)
青色の感度が低下
#008393
配色提案
この配色は中国の五行思想(木・火・土・金・水)の相生・相克の関係に着想を得て、伝統的な色彩調和の原理を反映しています。
補色
Complementary色相環の反対側に位置する色。最も強いコントラストを生む
類似色
Analogous色相が近い色の組み合わせ。自然で調和的な印象を与える
トライアド
Triadic色相環を三等分する配色。活力がありバランスの良い組み合わせ
スプリットコンプリメンタリー
Split-complementary補色の両隣を使う配色。補色より柔らかいコントラスト
テトラディック(正方形)
Tetradic (Square)色相環を四等分する配色。豊かな色彩で華やかな印象
テトラディック(長方形)
Tetradic (Rectangle)二対の補色を組み合わせた配色。多彩ながらまとまりのある配色
モノクロマティック
Monochromatic同じ色相で明度・彩度を変えた配色。統一感のある上品な印象
ダブルコンプリメンタリー
Double Complementary隣り合う二色とその補色による四色配色。複雑で魅力的な配色
グラデーション
ティント(明るく)
background: linear-gradient(to right, #446CCF, #FFFFFF); シェード(暗く)
background: linear-gradient(to right, #446CCF, #000000); 透明へ
background: linear-gradient(to right, #446CCF, transparent); エクスポート
--color-han_blue: #446CCF;
--color-han_blue-rgb: 68, 108, 207;
--color-han_blue-oklch: 55.44% 0.1595 265.07; $color-han_blue: #446CCF;
$color-han_blue-rgb: rgb(68, 108, 207);
$color-han_blue-oklch: oklch(55.44% 0.1595 265.07); 'han_blue': '#446CCF', Color(red: 0.267, green: 0.424, blue: 0.812) {
"name": {
"ja": "漢青",
"en": "Han Blue",
"reading": "かんせい",
"zh": "汉蓝"
},
"hex": "#446CCF",
"rgb": {
"r": 68,
"g": 108,
"b": 207
},
"cmyk": {
"c": 67.1,
"m": 47.8,
"y": 0,
"k": 18.8
},
"oklch": {
"l": 55.44,
"c": 0.1595,
"h": 265.07
},
"displayP3": {
"r": 0.3082,
"g": 0.4192,
"b": 0.7811
},
"hsv": {
"h": 222.7,
"s": 67.1,
"v": 81.2
},
"munsell": "7PB 4.8/12"
}