#EC9362#EC9362
#EC9362 is a light, vivid orange. Relative luminance 0.396; OKLCH L 74.5% C 0.126 H 48.9°. Best body text is #000000 at 8.92:1 contrast (WCAG AA passes).
Color values
| HEX | #EC9362 |
|---|---|
| RGB | rgb(236, 147, 98) |
| HSL | hsl(21, 78%, 65%) |
| HSV | hsv(21, 58%, 93%) |
| CMYK | cmyk(0%, 37.7%, 58.5%, 7.5%) |
| CIE-LAB | lab(69.17, 28.91, 39.78) |
| CIE-LCH | lch(69.17, 49.18, 53.99°) |
| OKLab | oklab(74.5% 0.0826 0.0946) |
| OKLCH | oklch(74.5% 0.126 48.9) |
| XYZ | xyz(47.2337, 39.5866, 16.7063) |
| Luminance | 0.3958 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Orangeish
#FD8D49
ΔE00 4.59
Faded Orange
#F0944D
ΔE00 5.01
Pastel Orange
#FF964F
ΔE00 5.05
Orangish
#FC824A
ΔE00 5.52
Lightsalmon
#FFA07A
ΔE00 5.58
Dusty Orange
#F0833A
ΔE00 5.85
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#EC9362 #62BBEC
analogous
#EC6276 #EC9362 #ECD862
triadic
#EC9362 #62EC93 #9362EC
tetradic
#EC9362 #76EC62 #62BBEC #D862EC
square
#EC9362 #76EC62 #62BBEC #D862EC
split-complementary
#EC9362 #62ECD8 #6276EC
monochromatic
#BD5217 #E56D2B #EC9362 #F3B999 #F9DECF
Accessibility & contrast
On white
2.36
#EC9362 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.92
#EC9362 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #EC9362
8.92:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##EC9362 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##EC9362 | 1.00 | 2.36 | 8.92 | 8.92 |
| #FFFFFF | 2.36 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.92 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.92 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#AB9D5E
Deuteranopia (green-blind)
#C1B162
Tritanopia (blue-blind)
#FF8287
Achromatopsia (no color)
#A9A9A9
Design tokens & code
CSS
--color: #ec9362; /* rgb */ color: rgb(236, 147, 98); /* oklch */ color: oklch(74.5% 0.126 48.9);
Tailwind
colors: {
custom: {
50: '#f6b38f',
500: '#ec9362',
950: '#000000',
},
}SCSS
$custom: #ec9362; $custom-light: #f6b38f; $custom-dark: #000000;
JSON
{
"hex": "#ec9362",
"rgb": {
"r": 236,
"g": 147,
"b": 98
},
"hsl": {
"h": 21.304,
"s": 78.409,
"l": 65.49
},
"oklch": {
"l": 0.74504,
"c": 0.12557,
"h": 48.9
},
"luminance": 0.39582
}Semantic roles & 50–950 ramp
primary
#EC9362
secondary
#BEDCEC
accent
#91DB0B
background
#FFFBF8
surface
#FFF6F0
border
#D7D0CB
text
#18110C
muted
#86807D