Nazwany kolor · #D0B082
Warm Butterscotch
Warm Butterscotch to #D0B082: rgb(208 176 130), hsl(35 45% 66%), oklch(0.774 0.072 76.4). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Orange mean? → · Warm Butterscotch color name →
#D0B082
oklch(0.774 0.072 76.4)
Konwersje koloru
- HEX
- #d0b082
- RGB
- rgb(208 176 130)
- HSL
- hsl(35 45% 66%)
- HWB
- hwb(35 51% 18%)
- OKLCH
- oklch(0.774 0.072 76.4)
- OKLab
- oklab(0.774 0.017 0.07)
- CIE Lab
- lab(73.88 7.26 28.14)
- LCH
- lch(73.88 29.07 75.5)
- CMYK
- cmyk(0% 15% 38% 18%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D5B88F
- DAC09B
- DEC7A7
- E3CFB4
- E8D7C0
- ECDFCD
- F1E7D9
- F6EFE6
- FAF7F2
Odcienie ciemniejsze
- B59970
- 9A825F
- 806C4E
- 67563E
- 4F422F
- 392E20
- 231C12
- 100B06
- 020101
Tony
- C8AB82
- C0A682
- B7A282
- AF9D82
- A79882
- 9F9382
- 978E82
- 908A81
- 888581
Harmonie kolorów
Komplementarna +180°
- D0B082
Warm Butterscotch
- 98B8E3
≈ Honest
Analogowa -30° +30°
- D0B082
Warm Butterscotch
- DDA88F
≈ Rose Tattoo
- BBB984
≈ Aloe Plant
Triada +120° +240°
- D0B082
Warm Butterscotch
- 7DC4C5
≈ Bay Mist
- C8A8D5
≈ Graceful Garden
Komplementarna rozszczepiona +150° +210°
- D0B082
Warm Butterscotch
- 84C0D9
≈ Blue Charm
- B1AFE2
≈ Maximum Blue Purple
Tetrada +90° +180° +270°
- D0B082
Warm Butterscotch
- 89C5AB
≈ Hellion Green
- 98B8E3
≈ Honest
- D8A4BF
≈ Rhubarb Gin
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.05:1 · APCA Lc 40
Ag
AAANa czerni
WCAG 10.21:1 · APCA Lc 62
Najlepszy kolor tekstu: #000000
WCAG 10.21:1 (AAA) · APCA Lc 62
Contrast pairs
Fragmenty kodu
CSS
:root {
--warm-butterscotch: #d0b082;
--warm-butterscotch-rgb: 208 176 130;
--warm-butterscotch-oklch: oklch(0.774 0.072 76.4);
}
.element {
color: var(--warm-butterscotch);
background-color: hsl(35 45% 66%);
border-color: oklch(0.774 0.072 76.4);
}Tailwind CSS v4
@theme {
--color-warm-butterscotch: #d0b082;
--color-warm-butterscotch-50: #fff3df;
--color-warm-butterscotch-100: #f5e6ce;
--color-warm-butterscotch-200: #e5d1b3;
--color-warm-butterscotch-300: #ccb48e;
--color-warm-butterscotch-400: #b7996e;
--color-warm-butterscotch-500: #a1804e;
--color-warm-butterscotch-600: #886c43;
--color-warm-butterscotch-700: #6d5735;
--color-warm-butterscotch-800: #513f25;
--color-warm-butterscotch-900: #392b19;
--color-warm-butterscotch-950: #23180a;
}SCSS
$warm-butterscotch: #d0b082;
$warm-butterscotch-rgb: 208, 176, 130;
$warm-butterscotch-light: mix(#fff, $warm-butterscotch, 20%);
$warm-butterscotch-dark: mix(#000, $warm-butterscotch, 20%);
.element {
color: $warm-butterscotch;
box-shadow: 0 0 0 2px rgba($warm-butterscotch, 0.35);
}