#000000

#412728

#7F4D3E

#B87C4C

#E2B659

Chocolate

#000000

#412728

#7F4D3E

#B87C4C

#E2B659



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

Brown

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#000000	rgb(0, 0, 0)	hsl(none 0% 0%)	hwb(none 0% 100%)	lch(0 0 none)	lab(0 0 0)	cmyk 0%, 0%, 0%, 100%
	#412728	rgb(65, 39, 40)	hsl(360 25% 20%)	hwb(360 15% 75%)	lch(19.1 13.5 20.3)	lab(19.1 12.7 4.7)	cmyk 0%, 40%, 38%, 75%
	#7f4d3e	rgb(127, 77, 62)	hsl(14 34% 37%)	hwb(14 24% 50%)	lch(38.4 27.4 41.8)	lab(38.4 20.4 18.3)	cmyk 0%, 39%, 51%, 50%
	#b87c4c	rgb(184, 124, 76)	hsl(27 43% 51%)	hwb(27 30% 28%)	lch(57.6 41.2 60.4)	lab(57.6 20.4 35.9)	cmyk 0%, 33%, 59%, 28%
	#e2b659	rgb(226, 182, 89)	hsl(41 70% 62%)	hwb(41 35% 11%)	lch(76.7 53.3 80.4)	lab(76.7 8.92 52.6)	cmyk 0%, 19%, 61%, 11%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#000000

AAA - 21



#412728

AAA - 13.58



#7F4D3E

AA - 6.92



#B87C4C

AA - 3.48



#E2B659

AA - 1.89



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(0% 0 0), oklab(30.6% 0.038 0.012), oklab(47.4% 0.057 0.044), oklab(63.8% 0.052 0.084), oklab(79.8% 0.013 0.121))

Fallback colors



background: linear-gradient(45deg, #000000, #412728, #7F4D3E, #B87C4C, #E2B659)

Colors



<!-- Primary Colors -->
<color name="chocolate_color_10">#000000</color>
<color name="chocolate_color_20">#412728</color>
<color name="chocolate_color_30">#7F4D3E</color>
<color name="chocolate_color_40">#B87C4C</color>
<color name="chocolate_color_50">#E2B659</color>

PWA prompt