色名 · #00A267
Emerald Light Green
Emerald Light Greenは#00A267：rgb(0 162 103)、hsl(158 100% 32%)、oklch(0.628 0.145 158.8)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Green mean? → · Emerald Light Green color name →
#00A267
oklch(0.628 0.145 158.8)
カラー変換
- HEX
- #00a267
- RGB
- rgb(0 162 103)
- HSL
- hsl(158 100% 32%)
- HWB
- hwb(158 0% 36%)
- OKLCH
- oklch(0.628 0.145 158.8)
- OKLab
- oklab(0.628 -0.135 0.052)
- CIE Lab
- lab(58.72 -48.13 20.27)
- LCH
- lch(58.72 52.23 157.2)
- CMYK
- cmyk(100% 0% 36% 36%)
ティント · シェード · トーン
ティント
- 3AAC76
- 57B584
- 6FBE93
- 85C8A2
- 9AD1B1
- AFDAC0
- C3E4D0
- D7EDDF
- EBF6EF
シェード
- 008C59
- 00774B
- 00633D
- 004F30
- 003C23
- 002A17
- 00190C
- 000A04
- 000100
トーン
- 299F6A
- 3B9C6D
- 49996F
- 549572
- 5D9274
- 658E77
- 6D8B79
- 74877B
- 7A847E
カラーハーモニー
補色 +180°
- 00A267
Emerald Light Green
- BF62A5
≈ Young Purple
類似色 -30° +30°
- 00A267
Emerald Light Green
- 6D982B
≈ Hidden Valley
- 009D96
≈ Caribbean Turquoise
トライアド +120° +240°
- 00A267
Emerald Light Green
- 777CDE
≈ Tanzine
- D06541
≈ Citrus Notes
スプリットコンプリメンタリー +150° +210°
- 00A267
Emerald Light Green
- A26DCA
≈ Rich Lavender
- CF5E76
≈ Tuna Sashimi
テトラード +90° +180° +270°
- 00A267
Emerald Light Green
- 338DDB
≈ Magical Merlin
- BF62A5
≈ Young Purple
- BD7600
≈ Cassandra’s Curse
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 3.29:1 · APCA Lc 60
Ag
AA黒の上
WCAG 6.36:1 · APCA Lc 42
最適な文字色: #000000
WCAG 6.36:1 (AA) · APCA Lc 42
Contrast pairs
コードスニペット
CSS
:root {
--emerald-light-green: #00a267;
--emerald-light-green-rgb: 0 162 103;
--emerald-light-green-oklch: oklch(0.628 0.145 158.8);
}
.element {
color: var(--emerald-light-green);
background-color: hsl(158 100% 32%);
border-color: oklch(0.628 0.145 158.8);
}Tailwind CSS v4
@theme {
--color-emerald-light-green: #00a267;
--color-emerald-light-green-50: #d2ffe8;
--color-emerald-light-green-100: #bef8d8;
--color-emerald-light-green-200: #9ce8c0;
--color-emerald-light-green-300: #6dce9f;
--color-emerald-light-green-400: #3eb87e;
--color-emerald-light-green-500: #00a261;
--color-emerald-light-green-600: #008953;
--color-emerald-light-green-700: #006e42;
--color-emerald-light-green-800: #00512d;
--color-emerald-light-green-900: #00381e;
--color-emerald-light-green-950: #00230e;
}SCSS
$emerald-light-green: #00a267;
$emerald-light-green-rgb: 0, 162, 103;
$emerald-light-green-light: mix(#fff, $emerald-light-green, 20%);
$emerald-light-green-dark: mix(#000, $emerald-light-green, 20%);
.element {
color: $emerald-light-green;
box-shadow: 0 0 0 2px rgba($emerald-light-green, 0.35);
}