Beam

#0a440a

#138a2e

#1ce152

#52f57e

Actions

Explore the palette in different formats, and actions.

Colors overview

Green

Color	HEX	RGB	HSL	OKLAB HDR	OKLCH HDR	P3 HDR
	#0a440a	rgb(10, 68, 10)	hsl(120 74% 15%)	oklab(34% -0.08 0.06)	oklch(34% 0.1 140)	color(display-p3 0.12 0.26 0.08)
	#138a2e	rgb(19, 138, 46)	hsl(130 76% 31%)	oklab(55% -0.13 0.09)	oklch(55% 0.16 150)	color(display-p3 0.25 0.53 0.23)
	#1ce152	rgb(28, 225, 82)	hsl(140 78% 50%)	oklab(79% -0.2 0.13)	oklch(79% 0.23 150)	color(display-p3 0.41 0.87 0.4)
	#52f57e	rgb(82, 245, 126)	hsl(140 89% 64%)	oklab(86% -0.18 0.11)	oklch(86% 0.21 150)	color(display-p3 0.52 0.95 0.54)

 Click on a color value to copy it to your clipboard.

Contrast ratios checker

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

#0a440a

AAA - 11.38



#138a2e

AA - 4.46



#1ce152

AA - 1.75



#52f57e

AA - 1.42



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.8% -0.083 0.063), oklab(55.3% -0.135 0.092), oklab(79.4% -0.195 0.13), oklab(85.9% -0.18 0.109))

Fallback colors



background: linear-gradient(45deg, #0a440a, #138a2e, #1ce152, #52f57e)

Colors



<!-- Primary Colors -->
<color name="beam_color_10">#0a440a</color>
<color name="beam_color_20">#138a2e</color>
<color name="beam_color_30">#1ce152</color>
<color name="beam_color_40">#52f57e</color>

PWA prompt