Named color · #EAD7B4
Sensible Hue
Sensible Hue is #EAD7B4: rgb(234 215 180), hsl(39 56% 81%), oklch(0.886 0.051 82.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Orange mean? → · Sensible Hue color name →
#EAD7B4
oklch(0.886 0.051 82.8)
Color conversions
- HEX
- #ead7b4
- RGB
- rgb(234 215 180)
- HSL
- hsl(39 56% 81%)
- HWB
- hwb(39 71% 8%)
- OKLCH
- oklch(0.886 0.051 82.8)
- OKLab
- oklab(0.886 0.006 0.05)
- CIE Lab
- lab(86.89 2.8 19.85)
- LCH
- lch(86.89 20.05 82)
- CMYK
- cmyk(0% 8% 23% 8%)
Tints · Shades · Tones
Tints
- ECDBBC
- EEDFC3
- F0E3CB
- F2E7D2
- F5EBD9
- F7EFE1
- F9F3E8
- FBF7F0
- FDFBF7
Shades
- CBBB9C
- AE9F85
- 91856E
- 756B58
- 5A5244
- 413B30
- 29251D
- 13110C
- 030202
Tones
- DFCEAF
- D4C5AA
- C9BCA4
- BEB39F
- B4AB9A
- A9A295
- 9F9990
- 94918A
- 8A8885
Color harmonies
Complementary +180°
- EAD7B4
Sensible Hue
- C8DAFC
≈ Icy Plains
Analogous -30° +30°
- EAD7B4
Sensible Hue
- F6D1BB
≈ Only Yesterday
- D9DDB7
≈ Clean Air
Triadic +120° +240°
- EAD7B4
Sensible Hue
- B3E4E8
≈ Winter Escape
- EACFED
≈ Lavender Princess
Split-complementary +150° +210°
- EAD7B4
Sensible Hue
- B9E0F6
≈ Arctic Paradise
- DAD4F9
≈ Japan Blush
Tetradic +90° +180° +270°
- EAD7B4
Sensible Hue
- B8E5D6
≈ Ode to Green
- C8DAFC
≈ Icy Plains
- F6CCDC
≈ Pink Lace
Contrast & accessibility
Ag
FailOn white
WCAG 1.41:1 · APCA Lc 20
Ag
AAAOn black
WCAG 14.87:1 · APCA Lc 84
Best text color: #000000
WCAG 14.87:1 (AAA) · APCA Lc 84
Contrast pairs
Code snippets
CSS
:root {
--sensible-hue: #ead7b4;
--sensible-hue-rgb: 234 215 180;
--sensible-hue-oklch: oklch(0.886 0.051 82.8);
}
.element {
color: var(--sensible-hue);
background-color: hsl(39 56% 81%);
border-color: oklch(0.886 0.051 82.8);
}Tailwind CSS v4
@theme {
--color-sensible-hue: #ead7b4;
--color-sensible-hue-50: #fcf4e5;
--color-sensible-hue-100: #f0e7d5;
--color-sensible-hue-200: #ded3bc;
--color-sensible-hue-300: #c3b69a;
--color-sensible-hue-400: #ad9c7d;
--color-sensible-hue-500: #97835f;
--color-sensible-hue-600: #7f6f51;
--color-sensible-hue-700: #665941;
--color-sensible-hue-800: #4c412e;
--color-sensible-hue-900: #342d1f;
--color-sensible-hue-950: #201a0f;
}SCSS
$sensible-hue: #ead7b4;
$sensible-hue-rgb: 234, 215, 180;
$sensible-hue-light: mix(#fff, $sensible-hue, 20%);
$sensible-hue-dark: mix(#000, $sensible-hue, 20%);
.element {
color: $sensible-hue;
box-shadow: 0 0 0 2px rgba($sensible-hue, 0.35);
}