#c86246

#f2957c

#eabaa4

#f7d7c8

#fdf1e7

Coral

#c86246

#f2957c

#eabaa4

#f7d7c8

#fdf1e7



Web code

Get CSS, SCSS, & Tailwind code for development



App tokens

Get Android, Flutter, Swift, & MAUI tokens



Quick view

Inspect colors in multiple color spaces

Colors overview

Orange

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#c86246	rgb(200, 98, 70)	hsl(13 54% 53%)	hwb(13 27% 22%)	lch(54 53.5 41.7)	lab(54 39.9 35.6)	cmyk 0%, 51%, 65%, 22%
	#f2957c	rgb(242, 149, 124)	hsl(13 82% 72%)	hwb(13 49% 5.1%)	lch(71.2 44.6 40.2)	lab(71.2 34 28.8)	cmyk 0%, 38%, 49%, 5%
	#eabaa4	rgb(234, 186, 164)	hsl(19 62% 78%)	hwb(19 64% 8.2%)	lch(79.5 23.9 49.3)	lab(79.5 15.6 18.1)	cmyk 0%, 21%, 30%, 8%
	#f7d7c8	rgb(247, 215, 200)	hsl(19 75% 88%)	hwb(19 78% 3.1%)	lch(88.4 15.3 50.2)	lab(88.4 9.79 11.7)	cmyk 0%, 13%, 19%, 3%
	#fdf1e7	rgb(253, 241, 231)	hsl(27 85% 95%)	hwb(27 91% 0.78%)	lch(95.9 7.01 65.2)	lab(95.9 2.94 6.36)	cmyk 0%, 5%, 9%, 1%

 Click a color format to copy to your clipboard.

Contrast ratios checker

Click one color card to view the complete contrast checker tests.

#c86246

AA - 3.96



#f2957c

AA - 2.24



#eabaa4

AA - 1.74



#f7d7c8

AA - 1.35



#fdf1e7

AA - 1.11



Color blindness

The simulation of color blindness may not be 100% accurate sometimes.

Colors preview as gradient with protanopia

Colors preview as palette with protanopia

UI components preview

Preview the gradient in different UI components.

HDR color space

HDR oklab colors



background: linear-gradient(45deg, oklab(61.3% 0.11 0.081), oklab(76% 0.096 0.069), oklab(82.6% 0.044 0.046), oklab(90.2% 0.028 0.03), oklab(96.5% 0.009 0.016))

Fallback colors



background: linear-gradient(45deg, #c86246, #f2957c, #eabaa4, #f7d7c8, #fdf1e7)

Colors



<!-- Primary Colors -->
<color name="coral_color_10">#c86246</color>
<color name="coral_color_20">#f2957c</color>
<color name="coral_color_30">#eabaa4</color>
<color name="coral_color_40">#f7d7c8</color>
<color name="coral_color_50">#fdf1e7</color>

PWA prompt