薄花色
うすはないろ | Usuhana-iro
広色域（Display P3）比較
sRGB（従来のWeb標準）
#698AAB
Display P3（広色域）
color(display-p3 0.4383 0.5375 0.6588)
意味と歴史
由来
花色を薄くしたような明るく薄い青紫色。「花色」は藍の単一染めの「縹色」の別名で、「花田」とも呼ばれた。その薄い色が色名として定着したもの。花色の由来は月草の花の青い汁で摺染をしたことに因む。
出典（1件）
歴史
平安時代からの色名で、三十六歌仙の一人・小大君の歌集『小大君集』には、薄花色の色合いと月草染めの色の移ろいやすさにかけて心の変化を詠んだ歌がある。浅縹や浅葱色と同色とする説もあるが、薄花色のほうが紫みが強い。
出典（1件）
CSSコード
HEX
#698AAB RGB
rgb(105, 138, 171) CMYK
cmyk(38.6%, 19.3%, 0%, 32.9%) HSV
hsv(210, 38.6%, 67.1%) OKLCH
oklch(62.1% 0.0626 248.88) Display P3
color(display-p3 0.4383 0.5375 0.6588) Munsell
CIE XYZ
XYZ(0.22263, 0.24119, 0.42003) CIE L*a*b*
Lab(56.207029, -3.025894, -21.096414) CIE LCH(ab)
LCH(56.207029, 21.312314, 261.837639°) CIE L*u*v*
Luv(56.207029, -16.990287, -31.238226) Hunter Lab
Hunter Lab(49.11139, -0.024441, -0.197813) xyY
xyY(0.251883, 0.272891, 0.24119) JzAzBz
JzAzBz(0.016174, -0.001798, -0.00525) JzCzHz
JzCzHz(0.016174, 0.005549, 251.09°) フォールバック付きCSS
.element {
/* sRGBフォールバック */
background-color: #698AAB;
background-color: oklch(62.1% 0.0626 248.88);
}
@media (color-gamut: p3) {
.element {
background-color: color(display-p3 0.4383 0.5375 0.6588);
}
}コントラストチェッカー
WCAG 2.1 基準に基づくコントラスト比を表示します。
白背景
3.61:1
黒背景
5.82:1
白文字
3.61:1
黒文字
5.82: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型）
赤色の感度が低下
#7D8BAD
D型（2型）
緑色の感度が低下
#7584AA
T型（3型）
青色の感度が低下
#529295
配色提案
この色の配色提案は、日本の伝統的な「かさねの色目」や「しきたり」の美意識に基づき、同じ文化圏の伝統色から最も近い調和色を選出しています。
補色
Complementary色相環の反対側に位置する色。最も強いコントラストを生む
類似色
Analogous色相が近い色の組み合わせ。自然で調和的な印象を与える
トライアド
Triadic色相環を三等分する配色。活力がありバランスの良い組み合わせ
スプリットコンプリメンタリー
Split-complementary補色の両隣を使う配色。補色より柔らかいコントラスト
テトラディック（正方形）
Tetradic (Square)色相環を四等分する配色。豊かな色彩で華やかな印象
テトラディック（長方形）
Tetradic (Rectangle)二対の補色を組み合わせた配色。多彩ながらまとまりのある配色
モノクロマティック
Monochromatic同じ色相で明度・彩度を変えた配色。統一感のある上品な印象
ダブルコンプリメンタリー
Double Complementary隣り合う二色とその補色による四色配色。複雑で魅力的な配色
伝統的な配色の提案
同じ文化圏の伝統色から、色彩理論的に調和する色を選出しました。
グラデーション
ティント（明るく）
background: linear-gradient(to right, #698AAB, #FFFFFF); シェード（暗く）
background: linear-gradient(to right, #698AAB, #000000); 透明へ
background: linear-gradient(to right, #698AAB, transparent); エクスポート
--color-usuhanairo: #698AAB;
--color-usuhanairo-rgb: 105, 138, 171;
--color-usuhanairo-oklch: 62.1% 0.0626 248.88;$color-usuhanairo: #698AAB;
$color-usuhanairo-rgb: rgb(105, 138, 171);
$color-usuhanairo-oklch: oklch(62.1% 0.0626 248.88);'usuhanairo': '#698AAB',Color(red: 0.412, green: 0.541, blue: 0.671){
"name": {
"ja": "薄花色",
"en": "Usuhana-iro",
"reading": "うすはないろ"
},
"hex": "#698AAB",
"rgb": {
"r": 105,
"g": 138,
"b": 171
},
"cmyk": {
"c": 38.6,
"m": 19.3,
"y": 0,
"k": 32.9
},
"oklch": {
"l": 62.1,
"c": 0.0626,
"h": 248.88
},
"displayP3": {
"r": 0.4383,
"g": 0.5375,
"b": 0.6588
},
"hsv": {
"h": 210,
"s": 38.6,
"v": 67.1
},
"munsell": ""
}