Adlandırılmış renk · #DBB486
Butterscotch Sundae
Butterscotch Sundae, #DBB486: rgb(219 180 134), hsl(32 54% 69%), oklch(0.794 0.076 71). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Orange mean? → · Butterscotch Sundae color name →
#DBB486
oklch(0.794 0.076 71)
Renk dönüşümleri
- HEX
- #dbb486
- RGB
- rgb(219 180 134)
- HSL
- hsl(32 54% 69%)
- HWB
- hwb(32 53% 14%)
- OKLCH
- oklch(0.794 0.076 71)
- OKLab
- oklab(0.794 0.025 0.072)
- CIE Lab
- lab(76.02 10.01 29.08)
- LCH
- lch(76.02 30.75 71)
- CMYK
- cmyk(0% 18% 39% 14%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- DFBB92
- E3C39E
- E6CAAA
- EAD2B6
- EDD9C2
- F1E1CE
- F5E8DB
- F8F0E7
- FCF7F3
Koyu tonlar
- BE9C74
- A28562
- 876E51
- 6D5840
- 544430
- 3C3021
- 261D13
- 110C06
- 020201
Gri tonlar
- D2AF86
- C8AA86
- BFA485
- B69F85
- AD9A84
- A49584
- 9B9083
- 928A82
- 898581
Renk uyumları
Tamamlayıcı +180°
- DBB486
Butterscotch Sundae
- 98C0EB
≈ Salvia Blue
Analog -30° +30°
- DBB486
Butterscotch Sundae
- E7AC96
≈ Pale Terra
- C6BE85
≈ Wheat Grass
Üçlü +120° +240°
- DBB486
Butterscotch Sundae
- 80CCC7
≈ Blue Green Gem
- CBAEE0
≈ Lavender Field Dreamer
Bölünmüş tamamlayıcı +150° +210°
- DBB486
Butterscotch Sundae
- 83C7DE
≈ Winter Chime
- B2B7EC
≈ Perano
Dörtlü +90° +180° +270°
- DBB486
Butterscotch Sundae
- 90CBAC
≈ Peppermint Spray
- 98C0EB
≈ Salvia Blue
- DEA9CA
≈ Aristocratic Pink
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.92:1 · APCA Lc 37
Ag
AAASiyah üzerinde
WCAG 10.88:1 · APCA Lc 66
En iyi metin rengi: #000000
WCAG 10.88:1 (AAA) · APCA Lc 66
Contrast pairs
Kod parçacıkları
CSS
:root {
--butterscotch-sundae: #dbb486;
--butterscotch-sundae-rgb: 219 180 134;
--butterscotch-sundae-oklch: oklch(0.794 0.076 71);
}
.element {
color: var(--butterscotch-sundae);
background-color: hsl(32 54% 69%);
border-color: oklch(0.794 0.076 71);
}Tailwind CSS v4
@theme {
--color-butterscotch-sundae: #dbb486;
--color-butterscotch-sundae-50: #fff2de;
--color-butterscotch-sundae-100: #f8e5cd;
--color-butterscotch-sundae-200: #e9d0b1;
--color-butterscotch-sundae-300: #d0b28d;
--color-butterscotch-sundae-400: #bb976d;
--color-butterscotch-sundae-500: #a67e4c;
--color-butterscotch-sundae-600: #8c6a41;
--color-butterscotch-sundae-700: #705533;
--color-butterscotch-sundae-800: #543e24;
--color-butterscotch-sundae-900: #3a2a18;
--color-butterscotch-sundae-950: #241809;
}SCSS
$butterscotch-sundae: #dbb486;
$butterscotch-sundae-rgb: 219, 180, 134;
$butterscotch-sundae-light: mix(#fff, $butterscotch-sundae, 20%);
$butterscotch-sundae-dark: mix(#000, $butterscotch-sundae, 20%);
.element {
color: $butterscotch-sundae;
box-shadow: 0 0 0 2px rgba($butterscotch-sundae, 0.35);
}