#ff4da6

#ffbdde

#ffd6eb

#fff0b3

#ffffff

Sweet

#ff4da6

#ffbdde

#ffd6eb

#fff0b3

#ffffff



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

Pink

Yellow

White

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#ff4da6	rgb(255, 77, 166)	hsl(330 100% 65%)	hwb(330 30% 0%)	lch(61.6 72.9 354)	lab(61.6 72.5 -7.99)	cmyk 0%, 70%, 35%, 0%
	#ffbdde	rgb(255, 189, 222)	hsl(330 100% 87%)	hwb(330 74% 0%)	lch(83.5 28.9 347)	lab(83.5 28.1 -6.74)	cmyk 0%, 26%, 13%, 0%
	#ffd6eb	rgb(255, 214, 235)	hsl(330 100% 92%)	hwb(330 84% 0%)	lch(89.6 17.9 345)	lab(89.6 17.3 -4.71)	cmyk 0%, 16%, 8%, 0%
	#fff0b3	rgb(255, 240, 179)	hsl(48 100% 85%)	hwb(48 70% 0%)	lch(94.9 31.5 92.4)	lab(94.9 -1.35 31.5)	cmyk 0%, 6%, 30%, 0%
	#ffffff	rgb(255, 255, 255)	hsl(none 0% 100%)	hwb(none 100% 0%)	lch(100 0 none)	lab(100 0 0)	cmyk 0%, 0%, 0%, 0%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#ff4da6

AA - 3.05



#ffbdde

AA - 1.54



#ffd6eb

AA - 1.3



#fff0b3

AA - 1.14



#ffffff

AA - 1



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(69.4% 0.225 -0.023), oklab(86.8% 0.084 -0.019), oklab(91.7% 0.051 -0.013), oklab(95.3% -0.008 0.079), oklab(100% 0 0))

Fallback colors



background: linear-gradient(45deg, #ff4da6, #ffbdde, #ffd6eb, #fff0b3, #ffffff)

Colors



<!-- Primary Colors -->
<color name="sweet_color_10">#ff4da6</color>
<color name="sweet_color_20">#ffbdde</color>
<color name="sweet_color_30">#ffd6eb</color>
<color name="sweet_color_40">#fff0b3</color>
<color name="sweet_color_50">#ffffff</color>

PWA prompt