#EAD989

#E4D181

#DAC777

#D1BE6E

Piña

Actions

Explore the gradient in different formats, and actions.

Colors overview

Yellow

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#ead989	rgb(234, 217, 137)	hsl(49 70% 73%)	hwb(49 54% 8.2%)	lch(86.8 41.6 92.7)	lab(86.8 -1.99 41.6)	cmyk 0%, 7%, 41%, 8%
	#e4d181	rgb(228, 209, 129)	hsl(48 65% 70%)	hwb(48 51% 11%)	lch(84.1 42.1 91.5)	lab(84.1 -1.11 42.1)	cmyk 0%, 8%, 43%, 11%
	#dac777	rgb(218, 199, 119)	hsl(48 57% 66%)	hwb(48 47% 15%)	lch(80.5 42.4 91.3)	lab(80.5 -0.982 42.4)	cmyk 0%, 9%, 45%, 15%
	#d1be6e	rgb(209, 190, 110)	hsl(48 52% 63%)	hwb(48 43% 18%)	lch(77.3 42.7 91.2)	lab(77.3 -0.858 42.7)	cmyk 0%, 9%, 47%, 18%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#EAD989

AA - 1.42



#E4D181

AA - 1.52



#DAC777

AA - 1.69



#D1BE6E

AA - 1.85



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(88.2% -0.014 0.101), oklab(85.9% -0.011 0.102), oklab(82.8% -0.011 0.102), oklab(80% -0.011 0.102))

Fallback colors



--angle: 45deg; 
background: linear-gradient(var(--angle), #EAD989, #E4D181, #DAC777, #D1BE6E)

Colors



<!-- Primary Colors -->
<color name="piña_color_10">#EAD989</color>
<color name="piña_color_20">#E4D181</color>
<color name="piña_color_30">#DAC777</color>
<color name="piña_color_40">#D1BE6E</color>

Gradient PRO

Pro feature only

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

PWA prompt