#5D688A

#DD7661

#FACB4A

#E4E2E1

#3B3F59

Chomp

#5D688A

#DD7661

#FACB4A

#E4E2E1

#3B3F59



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

Black

Red

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#5d688a	rgb(93, 104, 138)	hsl(230 19% 45%)	hwb(230 36% 46%)	lch(44.1 20.5 276)	lab(44.1 2.16 -20.4)	cmyk 33%, 25%, 0%, 46%
	#dd7661	rgb(221, 118, 97)	hsl(10 65% 62%)	hwb(10 38% 13%)	lch(61.5 50 37.6)	lab(61.5 39.6 30.5)	cmyk 0%, 47%, 56%, 13%
	#facb4a	rgb(250, 203, 74)	hsl(44 95% 64%)	hwb(44 29% 2%)	lch(84.2 68 83.3)	lab(84.2 7.9 67.6)	cmyk 0%, 19%, 70%, 2%
	#e4e2e1	rgb(228, 226, 225)	hsl(20 5.3% 89%)	hwb(20 88% 11%)	lch(90 0.934 52.5)	lab(90 0.568 0.741)	cmyk 0%, 1%, 1%, 11%
	#3b3f59	rgb(59, 63, 89)	hsl(230 20% 29%)	hwb(230 23% 65%)	lch(27.1 16.6 282)	lab(27.1 3.59 -16.3)	cmyk 34%, 29%, 0%, 65%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#5D688A

AA - 5.5



#DD7661

AA - 3.07



#FACB4A

AA - 1.53



#E4E2E1

AA - 1.29



#3B3F59

AAA - 10.28



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(52.2% 0 -0.056), oklab(67.8% 0.112 0.072), oklab(86.1% 0.004 0.151), oklab(91.4% 0.002 0.002), oklab(37.5% 0.006 -0.045))

Fallback colors



background: linear-gradient(45deg, #5D688A, #DD7661, #FACB4A, #E4E2E1, #3B3F59)

Colors



<!-- Primary Colors -->
<color name="chomp_color_10">#5D688A</color>
<color name="chomp_color_20">#DD7661</color>
<color name="chomp_color_30">#FACB4A</color>
<color name="chomp_color_40">#E4E2E1</color>
<color name="chomp_color_50">#3B3F59</color>

PWA prompt