水色
みずいろ|Mizu-iro
色コードの出典:水色 - 和色大辞典
広色域(Display P3)比較
sRGB(従来のWeb標準)
#BCE2E8
Display P3(広色域)
color(display-p3 0.7666 0.8818 0.9054)
意味と歴史
歴史
『万葉集』には『水縹』の名で、平安文学には『水の色』と記述されるなど、古くから親しまれてきた色である。江戸時代には『空色』や『浅葱色』と共に夏の着物の色として愛用され、帷子の地色として流行した。
出典(1件)
CSSコード
HEX
#BCE2E8RGB
rgb(188, 226, 232)CMYK
cmyk(19%, 2.6%, 0%, 9%)HSV
hsv(188.2, 19%, 91%)OKLCH
oklch(88.75% 0.0406 208.22)Display P3
color(display-p3 0.7666 0.8818 0.9054)Munsell
CIE XYZ
XYZ(0.62497, 0.70908, 0.86722)CIE L*a*b*
Lab(87.440431, -11.076884, -7.044557)CIE LCH(ab)
LCH(87.440431, 13.127191, 212.455104°)CIE L*u*v*
Luv(87.440431, -19.905344, -9.080598)Hunter Lab
Hunter Lab(84.207059, -10.547176, -6.973839)xyY
xyY(0.283912, 0.322124, 0.70908)JzAzBz
JzAzBz(0.031497, -0.002933, -0.002334)JzCzHz
JzCzHz(0.031497, 0.003748, 218.511801°)フォールバック付きCSS
.element {
/* sRGBフォールバック */
background-color: #BCE2E8;
background-color: oklch(88.75% 0.0406 208.22);
}
@media (color-gamut: p3) {
.element {
background-color: color(display-p3 0.7666 0.8818 0.9054);
}
}コントラストチェッカー
WCAG 2.1 基準に基づくコントラスト比を表示します。
白背景
1.38:1
黒背景
15.18:1
白文字
1.38:1
黒文字
15.18:1
配色シミュレーター
この色を背景やテキストに使用した場合のプレビューです。見た目の見本のため、読み上げからは省略しています。
色覚シミュレーション
P型(1型)
赤色の感度が低下
#DBDFE8
D型(2型)
緑色の感度が低下
#D4D9E8
T型(3型)
青色の感度が低下
#AFE6E4
配色提案
この色の配色提案は、日本の伝統的な「かさねの色目」や「しきたり」の美意識に基づき、同じ文化圏の伝統色から最も近い調和色を選出しています。
補色
Complementary色相環の反対側に位置する色。最も強いコントラストを生む
類似色
Analogous色相が近い色の組み合わせ。自然で調和的な印象を与える
トライアド
Triadic色相環を三等分する配色。活力がありバランスの良い組み合わせ
スプリットコンプリメンタリー
Split-complementary補色の両隣を使う配色。補色より柔らかいコントラスト
テトラディック(正方形)
Tetradic (Square)色相環を四等分する配色。豊かな色彩で華やかな印象
テトラディック(長方形)
Tetradic (Rectangle)二対の補色を組み合わせた配色。多彩ながらまとまりのある配色
モノクロマティック
Monochromatic同じ色相で明度・彩度を変えた配色。統一感のある上品な印象
ダブルコンプリメンタリー
Double Complementary隣り合う二色とその補色による四色配色。複雑で魅力的な配色
グラデーション
ティント(明るく)
background: linear-gradient(to right, #BCE2E8, #FFFFFF);シェード(暗く)
background: linear-gradient(to right, #BCE2E8, #000000);透明へ
background: linear-gradient(to right, #BCE2E8, transparent);エクスポート
--color-mizuiro: #BCE2E8;
--color-mizuiro-rgb: 188, 226, 232;
--color-mizuiro-oklch: 88.75% 0.0406 208.22;$color-mizuiro: #BCE2E8;
$color-mizuiro-rgb: rgb(188, 226, 232);
$color-mizuiro-oklch: oklch(88.75% 0.0406 208.22);'mizuiro': '#BCE2E8',Color(red: 0.737, green: 0.886, blue: 0.910){
"name": {
"ja": "水色",
"en": "Mizu-iro",
"reading": "みずいろ"
},
"hex": "#BCE2E8",
"rgb": {
"r": 188,
"g": 226,
"b": 232
},
"cmyk": {
"c": 19,
"m": 2.6,
"y": 0,
"k": 9
},
"oklch": {
"l": 88.75,
"c": 0.0406,
"h": 208.22
},
"displayP3": {
"r": 0.7666,
"g": 0.8818,
"b": 0.9054
},
"hsv": {
"h": 188.2,
"s": 19,
"v": 91
},
"munsell": ""
}