Almond

#45222d

#ffb259

#ffe6c9

#A08986



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

Brown

Yellow

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#45222d	rgb(69, 34, 45)	hsl(340 34% 20%)	hwb(340 13% 73%)	lch(18.5 18.2 1.68)	lab(18.5 18.2 0.534)	cmyk 0%, 51%, 35%, 73%
	#ffb259	rgb(255, 178, 89)	hsl(32 100% 67%)	hwb(32 35% 0%)	lch(78.9 60.5 67.8)	lab(78.9 22.9 56)	cmyk 0%, 30%, 65%, 0%
	#ffe6c9	rgb(255, 230, 201)	hsl(32 100% 89%)	hwb(32 79% 0%)	lch(92.8 18.3 72.3)	lab(92.8 5.57 17.5)	cmyk 0%, 10%, 21%, 0%
	#a08986	rgb(160, 137, 134)	hsl(6.9 12% 58%)	hwb(6.9 53% 37%)	lch(59.2 9.95 30.2)	lab(59.2 8.61 5)	cmyk 0%, 14%, 16%, 37%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#45222d

AAA - 13.81



#ffb259

AA - 1.78



#ffe6c9

AA - 1.2



#A08986

AA - 3.27



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(30.3% 0.055 0.001), oklab(82.1% 0.052 0.127), oklab(93.8% 0.015 0.045), oklab(65% 0.025 0.013))

Fallback colors



background: linear-gradient(45deg, #45222d, #ffb259, #ffe6c9, #A08986)

Colors



<!-- Primary Colors -->
<color name="almond_color_10">#45222d</color>
<color name="almond_color_20">#ffb259</color>
<color name="almond_color_30">#ffe6c9</color>
<color name="almond_color_40">#A08986</color>

PWA prompt