#124304

#2a8a32

#84bd6a

#a9ccb2

#d1e1d5

Patrick's Day

#124304

#2a8a32

#84bd6a

#a9ccb2

#d1e1d5



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

Green

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#124304	rgb(18, 67, 4)	hsl(110 89% 14%)	hwb(110 1.6% 74%)	lch(24.2 39.8 132)	lab(24.2 -26.5 29.7)	cmyk 73%, 0%, 94%, 74%
	#2a8a32	rgb(42, 138, 50)	hsl(130 53% 35%)	hwb(130 16% 46%)	lch(50.6 56.8 139)	lab(50.6 -42.7 37.5)	cmyk 70%, 0%, 64%, 46%
	#84bd6a	rgb(132, 189, 106)	hsl(100 39% 58%)	hwb(100 42% 26%)	lch(71.2 47.1 131)	lab(71.2 -30.7 35.7)	cmyk 30%, 0%, 44%, 26%
	#a9ccb2	rgb(169, 204, 178)	hsl(140 26% 73%)	hwb(140 66% 20%)	lch(78.9 18.3 151)	lab(78.9 -15.9 8.95)	cmyk 17%, 0%, 13%, 20%
	#d1e1d5	rgb(209, 225, 213)	hsl(140 21% 85%)	hwb(140 82% 12%)	lch(88.1 8.21 151)	lab(88.1 -7.19 3.96)	cmyk 7%, 0%, 5%, 12%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#124304

AAA - 11.47



#2a8a32

AA - 4.39



#84bd6a

AA - 2.21



#a9ccb2

AA - 1.75



#d1e1d5

AA - 1.35



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(33.7% -0.08 0.067), oklab(55.9% -0.125 0.089), oklab(73.9% -0.093 0.088), oklab(81.2% -0.046 0.024), oklab(89.4% -0.021 0.011))

Fallback colors



background: linear-gradient(45deg, #124304, #2a8a32, #84bd6a, #a9ccb2, #d1e1d5)

Colors



<!-- Primary Colors -->
<color name="patrick's_day_color_10">#124304</color>
<color name="patrick's_day_color_20">#2a8a32</color>
<color name="patrick's_day_color_30">#84bd6a</color>
<color name="patrick's_day_color_40">#a9ccb2</color>
<color name="patrick's_day_color_50">#d1e1d5</color>

PWA prompt