Flower

#49f2bf

#b5ffda

#e3ffed

#d3bef7

#5f18d9

Actions

Explore the palette in different formats, and actions.

Colors overview

Green

Purple

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#49f2bf	rgb(73, 242, 191)	hsl(160 87% 62%)	oklab(86% -0.15 0.03)	oklch(86% 0.16 170)	color(display-p3 0.5 0.94 0.76)
	#b5ffda	rgb(181, 255, 218)	hsl(150 100% 85%)	oklab(94% -0.08 0.03)	oklch(94% 0.09 160)	color(display-p3 0.77 0.99 0.86)
	#e3ffed	rgb(227, 255, 237)	hsl(140 100% 95%)	oklab(97% -0.03 0.01)	oklch(97% 0.04 160)	color(display-p3 0.91 1 0.93)
	#d3bef7	rgb(211, 190, 247)	hsl(260 78% 86%)	oklab(84% 0.04 -0.07)	oklch(84% 0.08 300)	color(display-p3 0.81 0.75 0.95)
	#5f18d9	rgb(95, 24, 217)	hsl(260 80% 47%)	oklab(46% 0.08 -0.24)	oklch(46% 0.25 290)	color(display-p3 0.34 0.12 0.82)

 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.

#49f2bf

AA - 1.42



#b5ffda

AA - 1.14



#e3ffed

AA - 1.06



#d3bef7

AA - 1.68



#5f18d9

AAA - 8.01



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(86.3% -0.152 0.031), oklab(94.1% -0.085 0.027), oklab(97.5% -0.035 0.014), oklab(83.8% 0.043 -0.069), oklab(46.5% 0.079 -0.239))

Fallback colors



background: linear-gradient(45deg, #49f2bf, #b5ffda, #e3ffed, #d3bef7, #5f18d9)

Colors



<!-- Primary Colors -->
<color name="flower_color_10">#49f2bf</color>
<color name="flower_color_20">#b5ffda</color>
<color name="flower_color_30">#e3ffed</color>
<color name="flower_color_40">#d3bef7</color>
<color name="flower_color_50">#5f18d9</color>

PWA prompt