千草色
ちぐさいろ | Chigusa Blue
広色域(Display P3)比較
sRGB(従来のWeb標準)
#3A8FB7
Display P3(広色域)
color(display-p3 0.32 0.55 0.7)
意味と歴史
由来
千草(ちぐさ)とも書く露草の花の澄んだ青色に由来する。早朝に咲いて昼には萎む露草の儚い青は、古来から摺り染めの染料として使われ、朝露に濡れた花弁の鮮やかな青は万葉の時代から歌人たちを魅了してきた。
歴史
万葉集に「つきくさ」の名で詠まれた古い色名で、露草の花弁を布に摺りつけて染める「摺り染め」は最も原始的な染色法のひとつ。ただし色が褪せやすいため、儚さの象徴としても和歌に詠まれた文学的な色である。
心理的効果
清々しさ、爽やかさ、朝の清涼感を感じさせる。露草の花のように朝だけ咲いて消える儚い青は、一瞬の美しさを惜しむ日本人の感性に響き、今この瞬間を大切にする心と、清らかな精神の輝きを象徴する色である。
伝統的な用途
露草の摺り染めとして古代の染色に用いられ、着物の染め色としても親しまれた。現代では千草色の名で和装の帯揚げや小物に使われるほか、陶磁器の釉薬色や夏のインテリアカラーとしても清涼感のある青が好まれている。
CSSコード
HEX
#3A8FB7 RGB
rgb(58, 143, 183) CMYK
cmyk(68%, 22%, 0%, 28%) HSV
hsv(199, 68%, 72%) OKLCH
oklch(0.616 0.101 232.2) Display P3
color(display-p3 0.32 0.55 0.7) Munsell
5B 5.6/6 フォールバック付きCSS
.element {
/* sRGBフォールバック */
background-color: #3A8FB7;
background-color: oklch(0.616 0.101 232.2);
}
@media (color-gamut: p3) {
.element {
background-color: color(display-p3 0.32 0.55 0.7);
}
} コントラストチェッカー
WCAG 2.1 基準に基づくコントラスト比を表示します。
白背景
3.63:1
黒背景
5.79:1
白文字
3.63:1
黒文字
5.79: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型)
赤色の感度が低下
#7B8DB9
D型(2型)
緑色の感度が低下
#6A81B6
T型(3型)
青色の感度が低下
#009A9C
配色提案
補色
色相環の反対側
類似色
色相が近い色
トライアド
三角形の配色
スプリットコンプリメンタリー
補色の両隣
グラデーション
ティント(明るく)
background: linear-gradient(to right, #3A8FB7, #FFFFFF); シェード(暗く)
background: linear-gradient(to right, #3A8FB7, #000000); 透明へ
background: linear-gradient(to right, #3A8FB7, transparent); エクスポート
--color-chigusa: #3A8FB7;
--color-chigusa-rgb: 58, 143, 183;
--color-chigusa-oklch: 0.616 0.101 232.2; $color-chigusa: #3A8FB7;
$color-chigusa-rgb: rgb(58, 143, 183);
$color-chigusa-oklch: oklch(0.616 0.101 232.2); 'chigusa': '#3A8FB7', Color(red: 0.227, green: 0.561, blue: 0.718) {
"name": {
"ja": "千草色",
"en": "Chigusa Blue",
"reading": "ちぐさいろ"
},
"hex": "#3A8FB7",
"rgb": {
"r": 58,
"g": 143,
"b": 183
},
"cmyk": {
"c": 68,
"m": 22,
"y": 0,
"k": 28
},
"oklch": {
"l": 0.616,
"c": 0.101,
"h": 232.2
},
"displayP3": {
"r": 0.32,
"g": 0.55,
"b": 0.7
},
"hsv": {
"h": 199,
"s": 68,
"v": 72
},
"munsell": "5B 5.6/6"
}