Material Green 500

Preview

Material Green 500

#4caf50

Overview

Family: Light Green

material

Accessibility on this swatch:

AAA

(7.56:1)

Contrast vs white: 2.78:1 · vs black: 7.56:1

Formats

HEX

#4caf50

RGB

rgb(76, 175, 80)

RGBA

rgba(76, 175, 80, 1)

HSL

hsl(122, 39%, 49%)

HSV

hsv(122, 57%, 69%)

LAB

lab(63.98% -48.54 39.73)

LCH

lch(63.98% 62.73 140.7)

OKLAB

oklab(0.6731 -0.1318 0.095)

OKLCH

oklch(0.6731 0.1625 144.22)

XYZ

xyz(19.76, 32.77, 12.87)

CMYK

cmyk(57%, 0%, 54%, 31%)

CSS

color: #4caf50;

CSS variable

--color-4caf50: #4caf50;

SCSS

$color-4caf50: #4caf50;

Tailwind

green-500

Export

Developer code

:root {
  --material-green-500-1: #4caf50;
}

Color psychology

Vitality, optimism, and renewal. Friendly for outdoor and lifestyle brands.

Usage examples: primary buttons, chart series, status badges, marketing gradients, and brand accents in the Light Green family.

Material Green 500