#FCC236#FCC236
#FCC236 is a very light, vivid orange. Relative luminance 0.595; OKLCH L 84.4% C 0.159 H 84.3°. Best body text is #000000 at 12.91:1 contrast (WCAG AA passes).
Color values
| HEX | #FCC236 |
|---|---|
| RGB | rgb(252, 194, 54) |
| HSL | hsl(42, 97%, 60%) |
| HSV | hsv(42, 79%, 99%) |
| CMYK | cmyk(0%, 23%, 78.6%, 1.2%) |
| CIE-LAB | lab(81.59, 8.51, 72.86) |
| CIE-LCH | lch(81.59, 73.36, 83.34°) |
| OKLab | oklab(84.45% 0.0156 0.1578) |
| OKLCH | oklch(84.45% 0.159 84.3) |
| XYZ | xyz(60.1065, 59.5498, 11.8178) |
| Luminance | 0.5955 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Marigold
#FCC006
ΔE00 2.18
Golden Rod
#F9BC08
ΔE00 2.25
Amber
#FFBF00
ΔE00 2.34
Sunflower
#FFC512
ΔE00 2.44
Goldenrod (survey)
#FAC205
ΔE00 2.63
Golden Yellow
#FEC615
ΔE00 2.67
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#FCC236 #3670FC
analogous
#FC5F36 #FCC236 #D3FC36
triadic
#FCC236 #36FCC2 #C236FC
tetradic
#FCC236 #36FC5F #3670FC #FC36D3
square
#FCC236 #36FC5F #3670FC #FC36D3
split-complementary
#FCC236 #36D3FC #5F36FC
monochromatic
#B58103 #F1AC04 #FCC236 #FDD472 #FEE7AF
Accessibility & contrast
On white
1.63
#FCC236 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
12.91
#FCC236 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #FCC236
12.91:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##FCC236 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##FCC236 | 1.00 | 1.63 | 12.91 | 12.91 |
| #FFFFFF | 1.63 | 1.00 | 21.00 | 21.00 |
| #000000 | 12.91 | 21.00 | 1.00 | 1.00 |
| ##000000 | 12.91 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#DBC218
Deuteranopia (green-blind)
#E9D13D
Tritanopia (blue-blind)
#FFAFA7
Achromatopsia (no color)
#CBCBCB
Design tokens & code
CSS
--color: #fcc236; /* rgb */ color: rgb(252, 194, 54); /* oklch */ color: oklch(84.4% 0.159 84.3);
Tailwind
colors: {
custom: {
50: '#ffd478',
500: '#fcc236',
950: '#000000',
},
}SCSS
$custom: #fcc236; $custom-light: #ffd478; $custom-dark: #000000;
JSON
{
"hex": "#fcc236",
"rgb": {
"r": 252,
"g": 194,
"b": 54
},
"hsl": {
"h": 42.424,
"s": 97.059,
"l": 60
},
"oklch": {
"l": 0.84447,
"c": 0.15861,
"h": 84.3
},
"luminance": 0.59545
}Semantic roles & 50–950 ramp
primary
#FCC236
secondary
#224DB4
accent
#68FF29
background
#FFFEFB
surface
#FFFBF2
border
#D7D4CC
text
#19140A
muted
#87837D