Cream

Actions

Explore the gradient in different formats, and actions.

White

Brown

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK	Color schemes
	#f3e4cd	rgb(243, 228, 205)	hsl(36 61% 88%)	hwb(36 80% 4.7%)	lch(91.4 13.4 79.1)	lab(91.4 2.55 13.2)	cmyk 0%, 6%, 16%, 5%
	#dec9ab	rgb(222, 201, 171)	hsl(35 44% 77%)	hwb(35 67% 13%)	lch(82.2 18.4 76.9)	lab(82.2 4.17 17.9)	cmyk 0%, 9%, 23%, 13%

 Click a color format to copy to your clipboard.

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

#f3e4cd

AA - 1.25



#dec9ab

AA - 1.6



The simulation of color blindness may not be 100% accurate sometimes.

Colors preview as gradient with protanopia

Colors preview as palette with protanopia

Preview the gradient in different UI components.



32°

CPU



48°

GPU



100%

Usage



11°

Rain



70%

Storage

HDR color space

HDR oklab colors



--angle: 45deg; 
background: linear-gradient(var(--angle), oklab(92.5% 0.007 0.034), oklab(84.6% 0.011 0.045))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #f3e4cd, #dec9ab)

Colors



<!-- Primary Colors -->
<color name="cream_color_10">#f3e4cd</color>
<color name="cream_color_20">#dec9ab</color>

Gradient PRO

Pro feature only

Get access to all app tokens, export files, and more.

PWA prompt