#EAD084

#A5632B

#78441E

#F2EACC

#372C21

Giraffe

#EAD084

#A5632B

#78441E

#F2EACC

#372C21



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

Yellow

Brown

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#ead084	rgb(234, 208, 132)	hsl(45 71% 72%)	hwb(45 52% 8.2%)	lch(84.4 41.2 87.2)	lab(84.4 1.99 41.1)	cmyk 0%, 11%, 44%, 8%
	#a5632b	rgb(165, 99, 43)	hsl(28 59% 41%)	hwb(28 17% 35%)	lch(48.8 48.6 60.4)	lab(48.8 24 42.3)	cmyk 0%, 40%, 74%, 35%
	#78441e	rgb(120, 68, 30)	hsl(25 60% 29%)	hwb(25 12% 53%)	lch(34.8 38.2 57.5)	lab(34.8 20.5 32.2)	cmyk 0%, 43%, 75%, 53%
	#f2eacc	rgb(242, 234, 204)	hsl(47 59% 87%)	hwb(47 80% 5.1%)	lch(92.8 15.7 93)	lab(92.8 -0.808 15.7)	cmyk 0%, 3%, 16%, 5%
	#372c21	rgb(55, 44, 33)	hsl(30 25% 17%)	hwb(30 13% 78%)	lch(19 9.91 67.6)	lab(19 3.78 9.16)	cmyk 0%, 20%, 40%, 78%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#EAD084

AA - 1.51



#A5632B

AA - 4.75



#78441E

AAA - 7.94



#F2EACC

AA - 1.2



#372C21

AAA - 13.59



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(86.3% -0.002 0.1), oklab(56.3% 0.059 0.093), oklab(44.2% 0.052 0.071), oklab(93.6% -0.003 0.04), oklab(30.2% 0.01 0.023))

Fallback colors



background: linear-gradient(45deg, #EAD084, #A5632B, #78441E, #F2EACC, #372C21)

Colors



<!-- Primary Colors -->
<color name="giraffe_color_10">#EAD084</color>
<color name="giraffe_color_20">#A5632B</color>
<color name="giraffe_color_30">#78441E</color>
<color name="giraffe_color_40">#F2EACC</color>
<color name="giraffe_color_50">#372C21</color>

PWA prompt