#fb9dff

#fba2ec

#fba7d8

#fbabc4

#fcaeae

#fcb198

#fdb37e

#feb561

Rosegold

Actions

Explore the gradient in different formats, and actions.

Colors overview

Pink

Yellow

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#fb9dff	rgb(251, 157, 255)	hsl(300 100% 81%)	hwb(300 62% 0%)	lch(77.1 57.8 324)	lab(77.1 46.7 -34.1)	cmyk 2%, 38%, 0%, 0%
	#fba2ec	rgb(251, 162, 236)	hsl(310 92% 81%)	hwb(310 64% 1.6%)	lch(77.5 47.8 331)	lab(77.5 41.8 -23.2)	cmyk 0%, 35%, 6%, 2%
	#fba7d8	rgb(251, 167, 216)	hsl(330 91% 82%)	hwb(330 65% 1.6%)	lch(78.1 38.7 343)	lab(78.1 36.9 -11.6)	cmyk 0%, 33%, 14%, 2%
	#fbabc4	rgb(251, 171, 196)	hsl(340 91% 83%)	hwb(340 67% 1.6%)	lch(78.5 32.7 360)	lab(78.5 32.7 -0.191)	cmyk 0%, 32%, 22%, 2%
	#fcaeae	rgb(252, 174, 174)	hsl(0 93% 84%)	hwb(0 68% 1.2%)	lch(78.8 31.8 22.5)	lab(78.8 29.4 12.2)	cmyk 0%, 31%, 31%, 1%
	#fcb198	rgb(252, 177, 152)	hsl(15 94% 79%)	hwb(15 60% 1.2%)	lch(79.1 35.6 43.1)	lab(79.1 26 24.4)	cmyk 0%, 30%, 40%, 1%
	#fdb37e	rgb(253, 179, 126)	hsl(25 97% 74%)	hwb(25 49% 0.78%)	lch(79.3 44.9 58.4)	lab(79.3 23.5 38.3)	cmyk 0%, 29%, 50%, 1%
	#feb561	rgb(254, 181, 97)	hsl(32 99% 69%)	hwb(32 38% 0.39%)	lch(79.6 57.1 68.1)	lab(79.6 21.3 53)	cmyk 0%, 29%, 62%, 0%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#fb9dff

AA - 1.84



#fba2ec

AA - 1.82



#fba7d8

AA - 1.8



#fbabc4

AA - 1.79



#fcaeae

AA - 1.77



#fcb198

AA - 1.76



#fdb37e

AA - 1.76



#feb561

AA - 1.75



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(82.3% 0.136 -0.094), oklab(82.4% 0.125 -0.063), oklab(82.5% 0.111 -0.032), oklab(82.5% 0.098 -0.001), oklab(82.5% 0.087 0.03), oklab(82.6% 0.074 0.06), oklab(82.5% 0.062 0.092), oklab(82.6% 0.049 0.122))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #fb9dff, #fba2ec, #fba7d8, #fbabc4, #fcaeae, #fcb198, #fdb37e, #feb561)

Colors



<!-- Primary Colors -->
<color name="rosegold_color_10">#fb9dff</color>
<color name="rosegold_color_20">#fba2ec</color>
<color name="rosegold_color_30">#fba7d8</color>
<color name="rosegold_color_40">#fbabc4</color>
<color name="rosegold_color_50">#fcaeae</color>
<color name="rosegold_color_60">#fcb198</color>
<color name="rosegold_color_70">#fdb37e</color>
<color name="rosegold_color_80">#feb561</color>

Gradient PRO

Pro feature only

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

PWA prompt