Benannte Farbe · #DF9D5B
Coffee Whip
Coffee Whip ist #DF9D5B: rgb(223 157 91), hsl(30 67% 62%), oklch(0.747 0.114 64.5). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Coffee Whip color name →
#DF9D5B
oklch(0.747 0.114 64.5)
Farbumrechnungen
- HEX
- #df9d5b
- RGB
- rgb(223 157 91)
- HSL
- hsl(30 67% 62%)
- HWB
- hwb(30 36% 13%)
- OKLCH
- oklch(0.747 0.114 64.5)
- OKLab
- oklab(0.747 0.049 0.103)
- CIE Lab
- lab(70.33 20.42 44.34)
- LCH
- lch(70.33 48.82 65.3)
- CMYK
- cmyk(0% 30% 59% 13%)
Tints · Shades · Tones
Tints
- E3A76D
- E6B17E
- EABB8E
- EDC49F
- F1CEAF
- F4D8BF
- F7E2CF
- FAECDF
- FCF5EF
Shades
- C2884E
- A57341
- 8A5F35
- 6F4C29
- 563A1E
- 3D2813
- 271809
- 120903
- 020100
Tones
- D59A60
- CC9865
- C2956A
- B9926E
- B08F71
- A68C75
- 9D8978
- 93867B
- 8A837E
Farbharmonien
Komplementär +180°
- DF9D5B
Coffee Whip
- 6AB4F0
≈ Sanctuary Spa
Analog -30° +30°
- DF9D5B
Coffee Whip
- EC927C
≈ Poodle Skirt Peach
- C4AC51
≈ Sun Dance
Triadisch +120° +240°
- DF9D5B
Coffee Whip
- 41C4B6
≈ Synergy
- BD9AE7
≈ Bright Lavender
Geteilt komplementär +150° +210°
- DF9D5B
Coffee Whip
- 40BFD9
≈ Bachelor Button
- 97A7F5
≈ Widowmaker
Tetradisch +90° +180° +270°
- DF9D5B
Coffee Whip
- 6EC28C
≈ Clover Mist
- 6AB4F0
≈ Sanctuary Spa
- D991CA
≈ Firm Pink
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.30:1 · APCA Lc 45
Ag
AAAAuf Schwarz
WCAG 9.11:1 · APCA Lc 57
Beste Textfarbe: #000000
WCAG 9.11:1 (AAA) · APCA Lc 57
Contrast pairs
Code-Snippets
CSS
:root {
--coffee-whip: #df9d5b;
--coffee-whip-rgb: 223 157 91;
--coffee-whip-oklch: oklch(0.747 0.114 64.5);
}
.element {
color: var(--coffee-whip);
background-color: hsl(30 67% 62%);
border-color: oklch(0.747 0.114 64.5);
}Tailwind CSS v4
@theme {
--color-coffee-whip: #df9d5b;
--color-coffee-whip-50: #fff0d3;
--color-coffee-whip-100: #ffe1c0;
--color-coffee-whip-200: #f6cba0;
--color-coffee-whip-300: #dfac77;
--color-coffee-whip-400: #cd8f52;
--color-coffee-whip-500: #b97423;
--color-coffee-whip-600: #9d6221;
--color-coffee-whip-700: #7e4f1a;
--color-coffee-whip-800: #5e3812;
--color-coffee-whip-900: #42270b;
--color-coffee-whip-950: #2a1501;
}SCSS
$coffee-whip: #df9d5b;
$coffee-whip-rgb: 223, 157, 91;
$coffee-whip-light: mix(#fff, $coffee-whip, 20%);
$coffee-whip-dark: mix(#000, $coffee-whip, 20%);
.element {
color: $coffee-whip;
box-shadow: 0 0 0 2px rgba($coffee-whip, 0.35);
}