Bells

#ffe572

#c28333

#d12f24

#992120

#243f20

Actions

Explore the palette in different formats, and actions.

Colors overview

Yellow

Red

Green

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#ffe572	rgb(255, 229, 114)	hsl(49 100% 72%)	hwb(49 45% 0%)	lch(91.4 58.5 90.8)	lab(91.4 -0.831 58.5)	cmyk 0%, 10%, 55%, 0%
	#c28333	rgb(194, 131, 51)	hsl(34 58% 48%)	hwb(34 20% 24%)	lch(60.3 55.1 68.9)	lab(60.3 19.9 51.4)	cmyk 0%, 32%, 74%, 24%
	#d12f24	rgb(209, 47, 36)	hsl(3.8 71% 48%)	hwb(3.8 14% 18%)	lch(47.4 78.4 37.4)	lab(47.4 62.3 47.6)	cmyk 0%, 78%, 83%, 18%
	#992120	rgb(153, 33, 32)	hsl(0.5 65% 36%)	hwb(0.5 13% 40%)	lch(34.5 59.3 34)	lab(34.5 49.2 33.1)	cmyk 0%, 78%, 79%, 40%
	#243f20	rgb(36, 63, 32)	hsl(110 33% 19%)	hwb(110 13% 75%)	lch(23.8 22.6 136)	lab(23.8 -16.3 15.6)	cmyk 43%, 0%, 49%, 75%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#ffe572

AA - 1.25



#c28333

AA - 3.18



#d12f24

AA - 5.06



#992120

AAA - 8.09



#243f20

AAA - 11.62



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(92.1% -0.016 0.137), oklab(66% 0.044 0.113), oklab(56.3% 0.174 0.097), oklab(44.9% 0.14 0.07), oklab(33.7% -0.048 0.039))

Fallback colors



background: linear-gradient(45deg, #ffe572, #c28333, #d12f24, #992120, #243f20)

Colors



<!-- Primary Colors -->
<color name="bells_color_10">#ffe572</color>
<color name="bells_color_20">#c28333</color>
<color name="bells_color_30">#d12f24</color>
<color name="bells_color_40">#992120</color>
<color name="bells_color_50">#243f20</color>

PWA prompt