Named color · #F4CF95
Impala
Impala is #F4CF95: rgb(244 207 149), hsl(37 81% 77%), oklch(0.873 0.085 78.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Impala color name →
#F4CF95
oklch(0.873 0.085 78.5)
Color conversions
- HEX
- #f4cf95
- RGB
- rgb(244 207 149)
- HSL
- hsl(37 81% 77%)
- HWB
- hwb(37 58% 4%)
- OKLCH
- oklch(0.873 0.085 78.5)
- OKLab
- oklab(0.873 0.017 0.083)
- CIE Lab
- lab(85.34 7.74 33.94)
- LCH
- lch(85.34 34.82 77.1)
- CMYK
- cmyk(0% 15% 39% 4%)
Tints · Shades · Tones
Tints
- F5D4A0
- F6D9AB
- F8DEB6
- F9E2C0
- FAE7CB
- FBECD5
- FCF1E0
- FDF6EA
- FEFAF5
Shades
- D4B481
- B5996D
- 977F5A
- 7A6748
- 5E4F37
- 443826
- 2B2316
- 141008
- 030201
Tones
- E8C793
- DCBF92
- D0B790
- C4AF8E
- B9A78C
- AD9F8A
- A29788
- 968F85
- 8B8883
Color harmonies
Complementary +180°
- F4CF95
Impala
- BCD7FF
≈ Oh Boy!
Analogous -30° +30°
- F4CF95
Impala
- FFC7AB
≈ Antique Coral
- DADA98
≈ Chalcedony
Triadic +120° +240°
- F4CF95
Impala
- 8EE7EA
≈ Aqua Fiesta
- EDC4FA
≈ Aquarelle Lilac
Split-complementary +150° +210°
- F4CF95
Impala
- 9DE0FF
≈ Columbia Blue
- D3CFFF
≈ Pale Lavender
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 1.47:1 · APCA Lc 23
Ag
AAAOn black
WCAG 14.20:1 · APCA Lc 81
Best text color: #000000
WCAG 14.20:1 (AAA) · APCA Lc 81
Contrast pairs
Code snippets
CSS
:root {
--impala: #f4cf95;
--impala-rgb: 244 207 149;
--impala-oklch: oklch(0.873 0.085 78.5);
}
.element {
color: var(--impala);
background-color: hsl(37 81% 77%);
border-color: oklch(0.873 0.085 78.5);
}Tailwind CSS v4
@theme {
--color-impala: #f4cf95;
--color-impala-50: #fff3da;
--color-impala-100: #f7e6c9;
--color-impala-200: #e7d1ac;
--color-impala-300: #ceb386;
--color-impala-400: #ba9963;
--color-impala-500: #a57f40;
--color-impala-600: #8b6c37;
--color-impala-700: #70562c;
--color-impala-800: #533e1e;
--color-impala-900: #3a2b14;
--color-impala-950: #241806;
}SCSS
$impala: #f4cf95;
$impala-rgb: 244, 207, 149;
$impala-light: mix(#fff, $impala, 20%);
$impala-dark: mix(#000, $impala, 20%);
.element {
color: $impala;
box-shadow: 0 0 0 2px rgba($impala, 0.35);
}