Sandstone

#CA6B51

#E59866

#827344

#5F5736



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

Green

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#ca6b51	rgb(202, 107, 81)	hsl(13 53% 55%)	hwb(13 32% 21%)	lch(56.3 48.9 41.2)	lab(56.3 36.8 32.2)	cmyk 0%, 47%, 60%, 21%
	#e59866	rgb(229, 152, 102)	hsl(24 71% 65%)	hwb(24 40% 10%)	lch(70 46.5 56)	lab(70 26 38.5)	cmyk 0%, 34%, 55%, 10%
	#827344	rgb(130, 115, 68)	hsl(45 31% 39%)	hwb(45 27% 49%)	lch(49 28.2 87.9)	lab(49 1.02 28.1)	cmyk 0%, 12%, 48%, 49%
	#5f5736	rgb(95, 87, 54)	hsl(48 28% 29%)	hwb(48 21% 63%)	lch(37.1 20.4 91.6)	lab(37.1 -0.584 20.4)	cmyk 0%, 8%, 43%, 63%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#CA6B51

AA - 3.66



#E59866

AA - 2.32



#827344

AA - 4.68



#5F5736

AAA - 7.23



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(63.2% 0.102 0.075), oklab(74.6% 0.068 0.091), oklab(55.8% -0.003 0.068), oklab(45.6% -0.005 0.05))

Fallback colors



background: linear-gradient(45deg, #CA6B51, #E59866, #827344, #5F5736)

Colors



<!-- Primary Colors -->
<color name="sandstone_color_10">#CA6B51</color>
<color name="sandstone_color_20">#E59866</color>
<color name="sandstone_color_30">#827344</color>
<color name="sandstone_color_40">#5F5736</color>

PWA prompt