Adlandırılmış renk · #D8B691
Nutmeg Glow
Nutmeg Glow, #D8B691: rgb(216 182 145), hsl(31 48% 71%), oklch(0.797 0.063 69.1). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Nutmeg Glow color name →
#D8B691
oklch(0.797 0.063 69.1)
Renk dönüşümleri
- HEX
- #d8b691
- RGB
- rgb(216 182 145)
- HSL
- hsl(31 48% 71%)
- HWB
- hwb(31 57% 15%)
- OKLCH
- oklch(0.797 0.063 69.1)
- OKLab
- oklab(0.797 0.023 0.059)
- CIE Lab
- lab(76.39 8.76 23.7)
- LCH
- lch(76.39 25.26 69.7)
- CMYK
- cmyk(0% 16% 33% 15%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- DCBD9C
- E0C4A7
- E4CCB2
- E8D3BD
- ECDAC8
- F0E2D3
- F4E9DE
- F7F0E9
- FBF8F4
Koyu tonlar
- BC9E7D
- A0866A
- 856F58
- 6B5946
- 534435
- 3B3025
- 251D15
- 110C07
- 020201
Gri tonlar
- CFB190
- C6AB8E
- BDA68D
- B4A08B
- AB9B89
- A39588
- 9A9086
- 918B84
- 898582
Renk uyumları
Tamamlayıcı +180°
- D8B691
Nutmeg Glow
- 9EC1E4
≈ Pale Cerulean
Analog -30° +30°
- D8B691
Nutmeg Glow
- E2B09F
≈ Pink Sand
- C6BE8F
≈ Candidate
Üçlü +120° +240°
- D8B691
Nutmeg Glow
- 8DCAC5
≈ Mercury Mist
- C9B2DC
≈ Sea Lavender
Bölünmüş tamamlayıcı +150° +210°
- D8B691
Nutmeg Glow
- 8EC7D9
≈ Blue Glint
- B3B9E6
≈ Perano
Dörtlü +90° +180° +270°
- D8B691
Nutmeg Glow
- 9ACAAE
≈ Mint Ice Cream
- 9EC1E4
≈ Pale Cerulean
- D9ADCA
≈ Pink Lavender
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.90:1 · APCA Lc 36
Ag
AAASiyah üzerinde
WCAG 11.01:1 · APCA Lc 66
En iyi metin rengi: #000000
WCAG 11.01:1 (AAA) · APCA Lc 66
Contrast pairs
Kod parçacıkları
CSS
:root {
--nutmeg-glow: #d8b691;
--nutmeg-glow-rgb: 216 182 145;
--nutmeg-glow-oklch: oklch(0.797 0.063 69.1);
}
.element {
color: var(--nutmeg-glow);
background-color: hsl(31 48% 71%);
border-color: oklch(0.797 0.063 69.1);
}Tailwind CSS v4
@theme {
--color-nutmeg-glow: #d8b691;
--color-nutmeg-glow-50: #fff3e2;
--color-nutmeg-glow-100: #f6e5d2;
--color-nutmeg-glow-200: #e6d0b8;
--color-nutmeg-glow-300: #ccb395;
--color-nutmeg-glow-400: #b79876;
--color-nutmeg-glow-500: #a27f57;
--color-nutmeg-glow-600: #896b4b;
--color-nutmeg-glow-700: #6e563b;
--color-nutmeg-glow-800: #513e2a;
--color-nutmeg-glow-900: #392b1c;
--color-nutmeg-glow-950: #23180d;
}SCSS
$nutmeg-glow: #d8b691;
$nutmeg-glow-rgb: 216, 182, 145;
$nutmeg-glow-light: mix(#fff, $nutmeg-glow, 20%);
$nutmeg-glow-dark: mix(#000, $nutmeg-glow, 20%);
.element {
color: $nutmeg-glow;
box-shadow: 0 0 0 2px rgba($nutmeg-glow, 0.35);
}