Food Color Palette

#f49a24

#f8bb6d

#fad29e

#ff6969

#d40a0a

#f49a24

#f8bb6d

#fad29e

#ff6969

#d40a0a

Colors overview

 Red

 Orange

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#f49a24	rgb(244, 154, 36)	hsl(34 90% 55%)	hwb(34 14% 4.3%)	lch(71.8 75.3 67.5)	lab(71.8 28.8 69.6)	cmyk 0%, 37%, 85%, 4%
	#f8bb6d	rgb(248, 187, 109)	hsl(34 91% 70%)	hwb(34 43% 2.7%)	lch(80.4 50.8 71)	lab(80.4 16.5 48)	cmyk 0%, 25%, 56%, 3%
	#fad29e	rgb(250, 210, 158)	hsl(34 90% 80%)	hwb(34 62% 2%)	lch(86.8 32.7 73.4)	lab(86.8 9.36 31.3)	cmyk 0%, 16%, 37%, 2%
	#ff6969	rgb(255, 105, 105)	hsl(0 100% 71%)	hwb(0 41% 0%)	lch(64.3 65.9 28)	lab(64.3 58.2 30.9)	cmyk 0%, 59%, 59%, 0%
	#d40a0a	rgb(212, 10, 10)	hsl(0 91% 44%)	hwb(0 3.9% 17%)	lch(45.5 90.3 39.7)	lab(45.5 69.5 57.7)	cmyk 0%, 95%, 95%, 17%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#f49a24

AA - 2.21



#f8bb6d

AA - 1.7



#fad29e

AA - 1.42



#ff6969

AA - 2.8



#d40a0a

AA - 5.45



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 space

HDR oklab colors New



background: linear-gradient(45deg, oklab(76.1% 0.064 0.146), oklab(83.2% 0.037 0.113), oklab(88.6% 0.023 0.078), oklab(70.9% 0.169 0.072), oklab(54.9% 0.194 0.107))

Fallback colors New



background: linear-gradient(45deg, #f49a24, #f8bb6d, #fad29e, #ff6969, #d40a0a)

Colors



<resources>
    <color name="food_100">#f49a24</color>
    <color name="food_200">#f8bb6d</color>
    <color name="food_300">#fad29e</color>
    <color name="food_400">#ff6969</color>
    <color name="food_500">#d40a0a</color>
</resources>

PWA prompt