#2e2e2e

#737373

#eddcbb

#e6a627

#ad3e1c

Canvas

#2e2e2e

#737373

#eddcbb

#e6a627

#ad3e1c



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

Grey

Yellow

Orange

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#2e2e2e	rgb(46, 46, 46)	hsl(none 0% 18%)	hwb(none 18% 82%)	lch(18.9 0 none)	lab(18.9 0 0)	cmyk 0%, 0%, 0%, 82%
	#737373	rgb(115, 115, 115)	hsl(none 0% 45%)	hwb(none 45% 55%)	lch(48.4 0 none)	lab(48.4 0 0)	cmyk 0%, 0%, 0%, 55%
	#eddcbb	rgb(237, 220, 187)	hsl(40 58% 83%)	hwb(40 73% 7.1%)	lch(88.5 18.6 83.1)	lab(88.5 2.23 18.5)	cmyk 0%, 7%, 21%, 7%
	#e6a627	rgb(230, 166, 39)	hsl(40 79% 53%)	hwb(40 15% 9.8%)	lch(72.9 70.8 76.1)	lab(72.9 17 68.7)	cmyk 0%, 28%, 83%, 10%
	#ad3e1c	rgb(173, 62, 28)	hsl(14 72% 39%)	hwb(14 11% 32%)	lch(42.5 63.1 44.4)	lab(42.5 45 44.2)	cmyk 0%, 64%, 84%, 32%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#2e2e2e

AAA - 13.57



#737373

AA - 4.74



#eddcbb

AA - 1.34



#e6a627

AA - 2.13



#ad3e1c

AA - 6.02



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(30.1% 0 0), oklab(55.6% 0 0), oklab(90% 0.005 0.047), oklab(76.7% 0.029 0.147), oklab(51.5% 0.122 0.091))

Fallback colors



background: linear-gradient(45deg, #2e2e2e, #737373, #eddcbb, #e6a627, #ad3e1c)

Colors



<!-- Primary Colors -->
<color name="canvas_color_10">#2e2e2e</color>
<color name="canvas_color_20">#737373</color>
<color name="canvas_color_30">#eddcbb</color>
<color name="canvas_color_40">#e6a627</color>
<color name="canvas_color_50">#ad3e1c</color>

PWA prompt