Red/Green

#d32f2f

#f44336

#ffffff

#4caf50

#212121

Actions

Explore the palette in different formats, and actions.

Colors overview

Red

Green

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#d32f2f	rgb(211, 47, 47)	hsl(0 65% 51%)	hwb(0 18% 17%)	lch(47.9 76 33.9)	lab(47.9 63.1 42.4)	cmyk 0%, 78%, 78%, 17%
	#f44336	rgb(244, 67, 54)	hsl(4.1 90% 58%)	hwb(4.1 21% 4.3%)	lch(56.5 83.3 36.4)	lab(56.5 67.1 49.4)	cmyk 0%, 73%, 78%, 4%
	#ffffff	rgb(255, 255, 255)	hsl(none 0% 100%)	hwb(none 100% 0%)	lch(100 0 none)	lab(100 0 0)	cmyk 0%, 0%, 0%, 0%
	#4caf50	rgb(76, 175, 80)	hsl(120 39% 49%)	hwb(120 30% 31%)	lch(64 59.6 139)	lab(64 -45 39)	cmyk 57%, 0%, 54%, 31%
	#212121	rgb(33, 33, 33)	hsl(none 0% 13%)	hwb(none 13% 87%)	lch(12.7 0 none)	lab(12.7 0 0)	cmyk 0%, 0%, 0%, 87%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#d32f2f

AA - 4.97



#f44336

AA - 3.68



#ffffff

AA - 1



#4caf50

AA - 2.77



#212121

AAA - 16.1



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(56.8% 0.179 0.089), oklab(64.3% 0.189 0.104), oklab(100% 0 0), oklab(67.3% -0.132 0.095), oklab(24.8% 0 0))

Fallback colors



background: linear-gradient(45deg, #d32f2f, #f44336, #ffffff, #4caf50, #212121)

Colors



<!-- Primary Colors -->
<color name="red/green_color_10">#d32f2f</color>
<color name="red/green_color_20">#f44336</color>
<color name="red/green_color_30">#ffffff</color>
<color name="red/green_color_40">#4caf50</color>
<color name="red/green_color_50">#212121</color>

PWA prompt