Citrus Bloom

#A2D19A

#C6E8BE

#F9F6E7

#F7C583

#E8944C

Actions

Explore the palette in different formats, and actions.

Colors overview

Green

White

Orange

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#a2d19a	rgb(162, 209, 154)	hsl(110 37% 71%)	hwb(110 60% 18%)	lch(79.4 32.5 137)	lab(79.4 -23.8 22.2)	cmyk 22%, 0%, 26%, 18%
	#c6e8be	rgb(198, 232, 190)	hsl(110 48% 83%)	hwb(110 75% 9%)	lch(88.7 24 136)	lab(88.7 -17.3 16.6)	cmyk 15%, 0%, 18%, 9%
	#f9f6e7	rgb(249, 246, 231)	hsl(50 60% 94%)	hwb(50 91% 2.4%)	lch(96.8 7.66 96.4)	lab(96.8 -0.854 7.62)	cmyk 0%, 1%, 7%, 2%
	#f7c583	rgb(247, 197, 131)	hsl(34 88% 74%)	hwb(34 51% 3.1%)	lch(83 42 72.7)	lab(83 12.5 40.1)	cmyk 0%, 20%, 47%, 3%
	#e8944c	rgb(232, 148, 76)	hsl(28 77% 60%)	hwb(28 30% 9%)	lch(69.2 58 61.1)	lab(69.2 28 50.8)	cmyk 0%, 36%, 67%, 9%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#A2D19A

AA - 1.73



#C6E8BE

AA - 1.33



#F9F6E7

AA - 1.08



#F7C583

AA - 1.58



#E8944C

AA - 2.39



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(81.3% -0.07 0.057), oklab(89.5% -0.051 0.043), oklab(97.1% -0.003 0.02), oklab(85.3% 0.029 0.097), oklab(73.9% 0.069 0.115))

Fallback colors



background: linear-gradient(45deg, #A2D19A, #C6E8BE, #F9F6E7, #F7C583, #E8944C)

Colors



<!-- Primary Colors -->
<color name="citrus_bloom_color_10">#A2D19A</color>
<color name="citrus_bloom_color_20">#C6E8BE</color>
<color name="citrus_bloom_color_30">#F9F6E7</color>
<color name="citrus_bloom_color_40">#F7C583</color>
<color name="citrus_bloom_color_50">#E8944C</color>

PWA prompt