色名 · #D4E092
Charming Green
Charming Greenは#D4E092：rgb(212 224 146)、hsl(69 56% 73%)、oklch(0.88 0.101 115.6)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Charming Green color name →
#D4E092
oklch(0.88 0.101 115.6)
カラー変換
- HEX
- #d4e092
- RGB
- rgb(212 224 146)
- HSL
- hsl(69 56% 73%)
- HWB
- hwb(69 57% 12%)
- OKLCH
- oklch(0.88 0.101 115.6)
- OKLab
- oklab(0.88 -0.044 0.091)
- CIE Lab
- lab(86.91 -13.13 36.81)
- LCH
- lch(86.91 39.09 109.6)
- CMYK
- cmyk(5% 0% 35% 12%)
ティント · シェード · トーン
ティント
- D8E39E
- DCE6A9
- E1EAB4
- E5EDBF
- E9F0CA
- EDF3D5
- F2F6DF
- F6F9EA
- FBFCF4
シェード
- B8C37E
- 9DA66B
- 838A58
- 697046
- 515635
- 3A3E25
- 242716
- 101208
- 020201
トーン
- CBD691
- C2CC90
- BAC28E
- B1B98D
- A9AF8B
- A0A689
- 989C87
- 909385
- 888982
カラーハーモニー
補色 +180°
- D4E092
Charming Green
- DACFFF
≈ Pale Lavender
類似色 -30° +30°
- D4E092
Charming Green
- F5D388
≈ Sprouted
- ADEAAF
≈ Appetite
トライアド +120° +240°
- D4E092
Charming Green
- ACDFFF
≈ Droplet
- FFC4D9
≈ Sweet Romance
スプリットコンプリメンタリー +150° +210°
- D4E092
Charming Green
- C5D7FF
≈ Pale Phthalo Blue
- FAC1FC
≈ Electric Lavender
テトラード +90° +180° +270°
- D4E092
Charming Green
- 7FEBF8
≈ Robin’s Egg
- DACFFF
≈ Pale Lavender
- FFC8C2
≈ The Bluff
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.41:1 · APCA Lc 20
Ag
AAA黒の上
WCAG 14.87:1 · APCA Lc 84
最適な文字色: #000000
WCAG 14.87:1 (AAA) · APCA Lc 84
Contrast pairs
コードスニペット
CSS
:root {
--charming-green: #d4e092;
--charming-green-rgb: 212 224 146;
--charming-green-oklch: oklch(0.88 0.101 115.6);
}
.element {
color: var(--charming-green);
background-color: hsl(69 56% 73%);
border-color: oklch(0.88 0.101 115.6);
}Tailwind CSS v4
@theme {
--color-charming-green: #d4e092;
--color-charming-green-50: #f2fad9;
--color-charming-green-100: #e5edc7;
--color-charming-green-200: #d0dbaa;
--color-charming-green-300: #b3bf83;
--color-charming-green-400: #9ca65e;
--color-charming-green-500: #838e38;
--color-charming-green-600: #6f7831;
--color-charming-green-700: #596027;
--color-charming-green-800: #424619;
--color-charming-green-900: #2e3010;
--color-charming-green-950: #1b1d03;
}SCSS
$charming-green: #d4e092;
$charming-green-rgb: 212, 224, 146;
$charming-green-light: mix(#fff, $charming-green, 20%);
$charming-green-dark: mix(#000, $charming-green, 20%);
.element {
color: $charming-green;
box-shadow: 0 0 0 2px rgba($charming-green, 0.35);
}