Sandstone

#CA6B51

#E59866

#827344

#5F5736

Actions

Explore the palette in different formats, and actions.

Colors overview

Orange

Green

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#ca6b51	rgb(202, 107, 81)	hsl(13 53% 55%)	oklab(63% 0.1 0.08)	oklch(63% 0.13 36)	color(display-p3 0.74 0.44 0.34)
	#e59866	rgb(229, 152, 102)	hsl(24 71% 65%)	oklab(75% 0.07 0.09)	oklch(75% 0.11 53)	color(display-p3 0.85 0.61 0.43)
	#827344	rgb(130, 115, 68)	hsl(45 31% 39%)	oklab(56% 0 0.07)	oklch(56% 0.07 92)	color(display-p3 0.5 0.45 0.29)
	#5f5736	rgb(95, 87, 54)	hsl(48 28% 29%)	oklab(46% -0.01 0.05)	oklch(46% 0.05 96)	color(display-p3 0.37 0.34 0.23)

 Click on a color value to copy it 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