Benannte Farbe · #D87839
Jaffa Orange
Jaffa Orange ist #D87839: rgb(216 120 57), hsl(24 67% 54%), oklch(0.669 0.142 51.1). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Jaffa Orange color name →
#D87839
oklch(0.669 0.142 51.1)
Farbumrechnungen
- HEX
- #d87839
- RGB
- rgb(216 120 57)
- HSL
- hsl(24 67% 54%)
- HWB
- hwb(24 22% 15%)
- OKLCH
- oklch(0.669 0.142 51.1)
- OKLab
- oklab(0.669 0.089 0.11)
- CIE Lab
- lab(60.77 34.89 50.3)
- LCH
- lch(60.77 61.21 55.3)
- CMYK
- cmyk(0% 44% 74% 15%)
Tints · Shades · Tones
Tints
- DD8650
- E29465
- E7A179
- EBAF8C
- EFBC9F
- F3CAB2
- F6D7C5
- FAE4D8
- FCF2EC
Shades
- BC6730
- A05728
- 85481F
- 6B3917
- 532A10
- 3B1D09
- 251004
- 110501
- 020100
Tones
- D07A44
- C77B4D
- BF7C55
- B67D5C
- AE7E63
- A57F69
- 9C7F6F
- 938075
- 8A807B
Farbharmonien
Komplementär +180°
- D87839
Jaffa Orange
- 00A2D8
≈ Vanadyl Blue
Analog -30° +30°
- D87839
Jaffa Orange
- DE6D6E
≈ Native Berry
- C08A00
≈ Kenyan Sand
Triadisch +120° +240°
- D87839
Jaffa Orange
- 00AE8A
≈ Arcadia
- 9683E5
≈ Perrywinkle
Geteilt komplementär +150° +210°
- D87839
Jaffa Orange
- 00A9B2
≈ Exotic Sea
- 6293EB
≈ Guilliman Blue
Tetradisch +90° +180° +270°
- D87839
Jaffa Orange
- 5FAA54
≈ Shiso Green
- 00A2D8
≈ Vanadyl Blue
- BC75C9
≈ Lavendless
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.15:1 · APCA Lc 58
Ag
AAAuf Schwarz
WCAG 6.66:1 · APCA Lc 44
Beste Textfarbe: #000000
WCAG 6.66:1 (AA) · APCA Lc 44
Contrast pairs
Code-Snippets
CSS
:root {
--jaffa-orange: #d87839;
--jaffa-orange-rgb: 216 120 57;
--jaffa-orange-oklch: oklch(0.669 0.142 51.1);
}
.element {
color: var(--jaffa-orange);
background-color: hsl(24 67% 54%);
border-color: oklch(0.669 0.142 51.1);
}Tailwind CSS v4
@theme {
--color-jaffa-orange: #d87839;
--color-jaffa-orange-50: #ffebd0;
--color-jaffa-orange-100: #ffdcbc;
--color-jaffa-orange-200: #ffc49b;
--color-jaffa-orange-300: #f0a371;
--color-jaffa-orange-400: #e0844a;
--color-jaffa-orange-500: #cd6511;
--color-jaffa-orange-600: #ad5614;
--color-jaffa-orange-700: #8b4410;
--color-jaffa-orange-800: #68310c;
--color-jaffa-orange-900: #492107;
--color-jaffa-orange-950: #301000;
}SCSS
$jaffa-orange: #d87839;
$jaffa-orange-rgb: 216, 120, 57;
$jaffa-orange-light: mix(#fff, $jaffa-orange, 20%);
$jaffa-orange-dark: mix(#000, $jaffa-orange, 20%);
.element {
color: $jaffa-orange;
box-shadow: 0 0 0 2px rgba($jaffa-orange, 0.35);
}