色名 · #D8BC23
Ghee Yellow
Ghee Yellowは#D8BC23：rgb(216 188 35)、hsl(51 72% 49%)、oklch(0.796 0.157 97.7)。ティント、シェード、ハーモニー、WCAG/APCAコントラスト、CSS・Tailwind v4・SCSSコードを確認できます。
What does Yellow mean? → · Ghee Yellow color name →
#D8BC23
oklch(0.796 0.157 97.7)
カラー変換
- HEX
- #d8bc23
- RGB
- rgb(216 188 35)
- HSL
- hsl(51 72% 49%)
- HWB
- hwb(51 14% 15%)
- OKLCH
- oklch(0.796 0.157 97.7)
- OKLab
- oklab(0.796 -0.021 0.155)
- CIE Lab
- lab(76.94 -0.11 72.2)
- LCH
- lch(76.94 72.2 90.1)
- CMYK
- cmyk(0% 13% 84% 15%)
ティント · シェード · トーン
ティント
- DCC349
- E0CA63
- E3D17A
- E7D88F
- EBDEA2
- EFE5B6
- F3ECC8
- F7F2DB
- FBF9ED
シェード
- BCA31D
- A08B17
- 857311
- 6B5D0C
- 534707
- 3B3204
- 251F01
- 110D00
- 020200
トーン
- CFB639
- C6B048
- BDAA54
- B4A45D
- AB9E65
- A2996C
- 999272
- 918C77
- 88867C
カラーハーモニー
補色 +180°
- D8BC23
Ghee Yellow
- ACB6FF
≈ Greyish Lavender
類似色 -30° +30°
- D8BC23
Ghee Yellow
- FEA737
≈ Tamago Orange
- A0CF58
≈ Young Green Onion
トライアド +120° +240°
- D8BC23
Ghee Yellow
- 00D2F9
≈ Tropical Turquoise
- FC92E0
≈ Pink Delight
スプリットコンプリメンタリー +150° +210°
- D8BC23
Ghee Yellow
- 82C3FF
≈ Maya Blue
- D4A4FF
≈ Lilac
テトラード +90° +180° +270°
コントラストとアクセシビリティ
Ag
Fail白の上
WCAG 1.88:1 · APCA Lc 36
Ag
AAA黒の上
WCAG 11.13:1 · APCA Lc 67
最適な文字色: #000000
WCAG 11.13:1 (AAA) · APCA Lc 67
Contrast pairs
コードスニペット
CSS
:root {
--ghee-yellow: #d8bc23;
--ghee-yellow-rgb: 216 188 35;
--ghee-yellow-oklch: oklch(0.796 0.157 97.7);
}
.element {
color: var(--ghee-yellow);
background-color: hsl(51 72% 49%);
border-color: oklch(0.796 0.157 97.7);
}Tailwind CSS v4
@theme {
--color-ghee-yellow: #d8bc23;
--color-ghee-yellow-50: #fff7c3;
--color-ghee-yellow-100: #f4eaad;
--color-ghee-yellow-200: #e4d686;
--color-ghee-yellow-300: #cbb951;
--color-ghee-yellow-400: #b89e00;
--color-ghee-yellow-500: #a38400;
--color-ghee-yellow-600: #8a7000;
--color-ghee-yellow-700: #6e5900;
--color-ghee-yellow-800: #534000;
--color-ghee-yellow-900: #3a2c00;
--color-ghee-yellow-950: #241900;
}SCSS
$ghee-yellow: #d8bc23;
$ghee-yellow-rgb: 216, 188, 35;
$ghee-yellow-light: mix(#fff, $ghee-yellow, 20%);
$ghee-yellow-dark: mix(#000, $ghee-yellow, 20%);
.element {
color: $ghee-yellow;
box-shadow: 0 0 0 2px rgba($ghee-yellow, 0.35);
}