Benannte Farbe · #DE954B
Orange Caramel
Orange Caramel ist #DE954B: rgb(222 149 75), hsl(30 69% 58%), oklch(0.729 0.126 63.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Orange Caramel color name →
#DE954B
oklch(0.729 0.126 63.8)
Farbumrechnungen
- HEX
- #de954b
- RGB
- rgb(222 149 75)
- HSL
- hsl(30 69% 58%)
- HWB
- hwb(30 29% 13%)
- OKLCH
- oklch(0.729 0.126 63.8)
- OKLab
- oklab(0.729 0.055 0.113)
- CIE Lab
- lab(68.19 23.33 49.73)
- LCH
- lch(68.19 54.93 64.9)
- CMYK
- cmyk(0% 33% 66% 13%)
Tints · Shades · Tones
Tints
- E2A060
- E6AB73
- EAB585
- EDC097
- F1CAA8
- F4D5BA
- F7DFCB
- FAEADC
- FCF4EE
Shades
- C18140
- A56D35
- 895A2B
- 6F4821
- 553717
- 3D260E
- 261606
- 120802
- 020100
Tones
- D59353
- CB925A
- C29060
- B98E66
- AF8C6B
- A68A70
- 9D8774
- 938579
- 8A837C
Farbharmonien
Komplementär +180°
- DE954B
Orange Caramel
- 5AAFF0
≈ Blue Jeans
Analog -30° +30°
- DE954B
Orange Caramel
- EB8972
≈ Thundelarra
- C2A53D
≈ Deadsy
Triadisch +120° +240°
- DE954B
Orange Caramel
- 1AC1B0
≈ Turquoise
- B893E8
≈ Bright Lavender
Geteilt komplementär +150° +210°
- DE954B
Orange Caramel
- 13BBD7
≈ Maldives
- 8FA1F6
≈ Cold Lips
Tetradisch +90° +180° +270°
- DE954B
Orange Caramel
- 61BE82
≈ Spearmint Burst
- 5AAFF0
≈ Blue Jeans
- D788C8
≈ Pink Punk
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.46:1 · APCA Lc 48
Ag
AAAAuf Schwarz
WCAG 8.50:1 · APCA Lc 54
Beste Textfarbe: #000000
WCAG 8.50:1 (AAA) · APCA Lc 54
Contrast pairs
Code-Snippets
CSS
:root {
--orange-caramel: #de954b;
--orange-caramel-rgb: 222 149 75;
--orange-caramel-oklch: oklch(0.729 0.126 63.8);
}
.element {
color: var(--orange-caramel);
background-color: hsl(30 69% 58%);
border-color: oklch(0.729 0.126 63.8);
}Tailwind CSS v4
@theme {
--color-orange-caramel: #de954b;
--color-orange-caramel-50: #ffefd0;
--color-orange-caramel-100: #ffe0bc;
--color-orange-caramel-200: #faca9b;
--color-orange-caramel-300: #e4aa70;
--color-orange-caramel-400: #d28d48;
--color-orange-caramel-500: #bf7109;
--color-orange-caramel-600: #a1600f;
--color-orange-caramel-700: #814d0d;
--color-orange-caramel-800: #613709;
--color-orange-caramel-900: #442506;
--color-orange-caramel-950: #2c1400;
}SCSS
$orange-caramel: #de954b;
$orange-caramel-rgb: 222, 149, 75;
$orange-caramel-light: mix(#fff, $orange-caramel, 20%);
$orange-caramel-dark: mix(#000, $orange-caramel, 20%);
.element {
color: $orange-caramel;
box-shadow: 0 0 0 2px rgba($orange-caramel, 0.35);
}