#f1bd9e

#f3cfb1

#f7e1cc

#fae7e4

#fcf4f1

Peach

Actions

Explore the gradient in different formats, and actions.

Colors overview

Orange

White

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#f1bd9e	rgb(241, 189, 158)	hsl(22 75% 78%)	hwb(22 62% 5.5%)	lch(80.8 28.4 55.1)	lab(80.8 16.2 23.2)	cmyk 0%, 22%, 34%, 5%
	#f3cfb1	rgb(243, 207, 177)	hsl(27 73% 82%)	hwb(27 69% 4.7%)	lch(85.7 22.2 63.7)	lab(85.7 9.84 19.9)	cmyk 0%, 15%, 27%, 5%
	#f7e1cc	rgb(247, 225, 204)	hsl(29 73% 88%)	hwb(29 80% 3.1%)	lch(90.9 14.2 67.9)	lab(90.9 5.35 13.2)	cmyk 0%, 9%, 17%, 3%
	#fae7e4	rgb(250, 231, 228)	hsl(8.2 69% 94%)	hwb(8.2 89% 2%)	lch(93.1 7.44 31.8)	lab(93.1 6.32 3.92)	cmyk 0%, 8%, 9%, 2%
	#fcf4f1	rgb(252, 244, 241)	hsl(16 65% 97%)	hwb(16 95% 1.2%)	lch(96.8 3.42 45.7)	lab(96.8 2.39 2.45)	cmyk 0%, 3%, 4%, 1%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#f1bd9e

AA - 1.67



#f3cfb1

AA - 1.46



#f7e1cc

AA - 1.26



#fae7e4

AA - 1.19



#fcf4f1

AA - 1.08



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.



32°

CPU



48°

GPU



100%

Usage



11°

Rain



70%

Storage

HDR color space

HDR oklab colors



--angle: 45deg; 
background: linear-gradient(var(--angle), oklab(83.7% 0.045 0.058), oklab(87.8% 0.027 0.05), oklab(92.2% 0.015 0.034), oklab(94.2% 0.019 0.01), oklab(97.3% 0.007 0.006))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #f1bd9e, #f3cfb1, #f7e1cc, #fae7e4, #fcf4f1)

Colors



<!-- Primary Colors -->
<color name="peach_color_10">#f1bd9e</color>
<color name="peach_color_20">#f3cfb1</color>
<color name="peach_color_30">#f7e1cc</color>
<color name="peach_color_40">#fae7e4</color>
<color name="peach_color_50">#fcf4f1</color>

Gradient PRO

Pro feature only

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

PWA prompt