翡翠色
ひすいいろ | Jade Green
広色域(Display P3)比較
sRGB(従来のWeb標準)
#38B48B
Display P3(広色域)
color(display-p3 0.37 0.7 0.56)
意味と歴史
由来
翡翠(ひすい)の宝石の色に由来する色名。「翡翠」の漢字は本来カワセミという鳥を指し、その美しい羽色が宝石の名前に転用された。硬玉(ジェダイト)の半透明な緑色は東洋では最高の宝石として金以上に珍重されてきた。
歴史
新潟県糸魚川産の翡翠は世界最古の翡翠文化を持ち、約七千年前の縄文時代から勾玉や大珠に加工された。古代出雲や大和の権力者に献上され、三種の神器の一つ「八尺瓊勾玉」も翡翠製と伝えられる日本の至宝の色である。
心理的効果
高貴さと永遠の若さ、神秘的な力を感じさせる色で、古代から魔除けや霊力の象徴として崇められてきた。深い緑の透明感は精神を浄化し、心身に調和と安定をもたらすとされ、持つ者に不老長寿と繁栄の恩恵を授けると信じられている。
伝統的な用途
縄文時代の勾玉や大珠、古墳時代の装身具、神社の御神宝に用いられてきた。現代でも糸魚川翡翠のアクセサリーは人気が高く、パワーストーンとして愛用されるほか、高級宝飾品や茶道具の翡翠釉の陶器にもこの色が活かされている。
CSSコード
HEX
#38B48B RGB
rgb(56, 180, 139) CMYK
cmyk(69%, 0%, 23%, 29%) HSV
hsv(160, 69%, 71%) OKLCH
oklch(0.692 0.124 166.7) Display P3
color(display-p3 0.37 0.7 0.56) Munsell
7.5G 6.6/8 フォールバック付きCSS
.element {
/* sRGBフォールバック */
background-color: #38B48B;
background-color: oklch(0.692 0.124 166.7);
}
@media (color-gamut: p3) {
.element {
background-color: color(display-p3 0.37 0.7 0.56);
}
} コントラストチェッカー
WCAG 2.1 基準に基づくコントラスト比を表示します。
白背景
2.60:1
黒背景
8.07:1
白文字
2.60:1
黒文字
8.07: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型)
赤色の感度が低下
#B0A889
D型(2型)
緑色の感度が低下
#9F9C8E
T型(3型)
青色の感度が低下
#00B5A9
配色提案
補色
色相環の反対側
類似色
色相が近い色
トライアド
三角形の配色
スプリットコンプリメンタリー
補色の両隣
グラデーション
ティント(明るく)
background: linear-gradient(to right, #38B48B, #FFFFFF); シェード(暗く)
background: linear-gradient(to right, #38B48B, #000000); 透明へ
background: linear-gradient(to right, #38B48B, transparent); エクスポート
--color-hisuiiro: #38B48B;
--color-hisuiiro-rgb: 56, 180, 139;
--color-hisuiiro-oklch: 0.692 0.124 166.7; $color-hisuiiro: #38B48B;
$color-hisuiiro-rgb: rgb(56, 180, 139);
$color-hisuiiro-oklch: oklch(0.692 0.124 166.7); 'hisuiiro': '#38B48B', Color(red: 0.220, green: 0.706, blue: 0.545) {
"name": {
"ja": "翡翠色",
"en": "Jade Green",
"reading": "ひすいいろ"
},
"hex": "#38B48B",
"rgb": {
"r": 56,
"g": 180,
"b": 139
},
"cmyk": {
"c": 69,
"m": 0,
"y": 23,
"k": 29
},
"oklch": {
"l": 0.692,
"c": 0.124,
"h": 166.7
},
"displayP3": {
"r": 0.37,
"g": 0.7,
"b": 0.56
},
"hsv": {
"h": 160,
"s": 69,
"v": 71
},
"munsell": "7.5G 6.6/8"
}