Mango Color Gradient

 #fff0b3

 #ffe375

 #ffd08a

Colors overview

Yellow

Orange

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#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%
	#ffe375	rgb(255, 227, 117)	hsl(48 100% 73%)	hwb(48 46% 0%)	lch(91 56.6 89.7)	lab(91 0.286 56.6)	cmyk 0%, 11%, 54%, 0%
	#ffd08a	rgb(255, 208, 138)	hsl(36 100% 77%)	hwb(36 54% 0%)	lch(86.5 42.6 75.3)	lab(86.5 10.8 41.2)	cmyk 0%, 18%, 46%, 0%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#fff0b3

AA - 1.14



#ffe375

AA - 1.27



#ffd08a

AA - 1.43



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(95.3% -0.008 0.079), oklab(91.7% -0.012 0.133), oklab(88.3% 0.023 0.1))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #fff0b3, #ffe375, #ffd08a)

Colors



<!-- Primary Colors -->
<color name="mango_color_10">#fff0b3</color>
<color name="mango_color_20">#ffe375</color>
<color name="mango_color_30">#ffd08a</color>

Gradient PRO

Pro feature only

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

PWA prompt