#df4d3b

#f2614e

#f67833

#fead4b

#ffe3b2

October

#df4d3b

#f2614e

#f67833

#fead4b

#ffe3b2



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

Orange

Yellow

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#df4d3b	rgb(223, 77, 59)	hsl(6.6 72% 55%)	hwb(6.6 23% 13%)	lch(54 71.4 36.9)	lab(54 57 42.9)	cmyk 0%, 65%, 74%, 13%
	#f2614e	rgb(242, 97, 78)	hsl(7 86% 63%)	hwb(7 31% 5.1%)	lch(60.6 69.3 36.1)	lab(60.6 56 40.8)	cmyk 0%, 60%, 68%, 5%
	#f67833	rgb(246, 120, 51)	hsl(21 92% 58%)	hwb(21 20% 3.5%)	lch(65.1 75 51.8)	lab(65.1 46.4 58.9)	cmyk 0%, 51%, 79%, 4%
	#fead4b	rgb(254, 173, 75)	hsl(33 99% 65%)	hwb(33 29% 0.39%)	lch(77.5 65.5 68.1)	lab(77.5 24.4 60.8)	cmyk 0%, 32%, 70%, 0%
	#ffe3b2	rgb(255, 227, 178)	hsl(38 100% 85%)	hwb(38 70% 0%)	lch(91.7 28.1 80.2)	lab(91.7 4.77 27.7)	cmyk 0%, 11%, 30%, 0%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#df4d3b

AA - 3.99



#f2614e

AA - 3.18



#f67833

AA - 2.74



#fead4b

AA - 1.85



#ffe3b2

AA - 1.24



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(61.9% 0.16 0.093), oklab(67.5% 0.158 0.091), oklab(70.9% 0.121 0.125), oklab(80.9% 0.055 0.135), oklab(92.7% 0.01 0.069))

Fallback colors



background: linear-gradient(45deg, #df4d3b, #f2614e, #f67833, #fead4b, #ffe3b2)

Colors



<!-- Primary Colors -->
<color name="october_color_10">#df4d3b</color>
<color name="october_color_20">#f2614e</color>
<color name="october_color_30">#f67833</color>
<color name="october_color_40">#fead4b</color>
<color name="october_color_50">#ffe3b2</color>

PWA prompt