Benannte Farbe · #AB7E5E
Burnt Toffee
Burnt Toffee ist #AB7E5E: rgb(171 126 94), hsl(25 31% 52%), oklch(0.63 0.072 56.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Burnt Toffee color name →
#AB7E5E
oklch(0.63 0.072 56.4)
Farbumrechnungen
- HEX
- #ab7e5e
- RGB
- rgb(171 126 94)
- HSL
- hsl(25 31% 52%)
- HWB
- hwb(25 37% 33%)
- OKLCH
- oklch(0.63 0.072 56.4)
- OKLab
- oklab(0.63 0.04 0.06)
- CIE Lab
- lab(56.78 15 24.61)
- LCH
- lch(56.78 28.82 58.6)
- CMYK
- cmyk(0% 26% 45% 33%)
Tints · Shades · Tones
Tints
- B48A6E
- BC977D
- C5A48D
- CDB09D
- D5BDAD
- DECABD
- E6D7CD
- EEE4DE
- F7F2EE
Shades
- 946D51
- 7E5C44
- 684C37
- 543C2B
- 402D1F
- 2D1F14
- 1B110A
- 0B0503
- 010100
Tones
- A77E62
- A37F66
- 9F7F69
- 9A7F6D
- 968070
- 928073
- 8D8077
- 89807A
- 85807D
Farbharmonien
Komplementär +180°
- AB7E5E
Burnt Toffee
- 5D90AF
≈ Alpha Tango
Analog -30° +30°
- AB7E5E
Burnt Toffee
- B17872
≈ Earth Rose
- 9C8655
≈ Spacious Plain
Triadisch +120° +240°
- AB7E5E
Burnt Toffee
- 569888
≈ Petrol Green
- 8D80B0
≈ Aster Purple
Geteilt komplementär +150° +210°
- AB7E5E
Burnt Toffee
- 4F969F
≈ Sea Current
- 7588B5
≈ Wild Blue Yonder
Tetradisch +90° +180° +270°
- AB7E5E
Burnt Toffee
- 6C956F
≈ Tabbouleh
- 5D90AF
≈ Alpha Tango
- A07AA0
≈ Pishposh
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.57:1 · APCA Lc 63
Ag
AAAuf Schwarz
WCAG 5.87:1 · APCA Lc 38
Beste Textfarbe: #000000
WCAG 5.87:1 (AA) · APCA Lc 38
Contrast pairs
Code-Snippets
CSS
:root {
--burnt-toffee: #ab7e5e;
--burnt-toffee-rgb: 171 126 94;
--burnt-toffee-oklch: oklch(0.63 0.072 56.4);
}
.element {
color: var(--burnt-toffee);
background-color: hsl(25 31% 52%);
border-color: oklch(0.63 0.072 56.4);
}Tailwind CSS v4
@theme {
--color-burnt-toffee: #ab7e5e;
--color-burnt-toffee-50: #fff1e1;
--color-burnt-toffee-100: #fbe3d1;
--color-burnt-toffee-200: #edcdb7;
--color-burnt-toffee-300: #d4af93;
--color-burnt-toffee-400: #c09475;
--color-burnt-toffee-500: #ab7a56;
--color-burnt-toffee-600: #91674a;
--color-burnt-toffee-700: #74523b;
--color-burnt-toffee-800: #563c2a;
--color-burnt-toffee-900: #3c291c;
--color-burnt-toffee-950: #26170c;
}SCSS
$burnt-toffee: #ab7e5e;
$burnt-toffee-rgb: 171, 126, 94;
$burnt-toffee-light: mix(#fff, $burnt-toffee, 20%);
$burnt-toffee-dark: mix(#000, $burnt-toffee, 20%);
.element {
color: $burnt-toffee;
box-shadow: 0 0 0 2px rgba($burnt-toffee, 0.35);
}