Color code and palette
Shades of Green
Green connects digital products with growth, nature and positive outcomes. This collection includes pale mint, balanced emerald and deep forest values for states, dashboards and identity work.
Green #22C55E
Color formats
The same base color in common web formats.
HEX
#22C55E RGB
rgb(34, 197, 94) HSL
hsl(142, 71%, 45%) OKLCH
oklch(72.0% 0.192 150.0) Green connects digital products with growth, nature and positive outcomes. This collection includes pale mint, balanced emerald and deep forest values for states, dashboards and identity work.
Shades
| Color | Name | Hex | |
|---|---|---|---|
| Mint Cream | #F0FDF4 | ||
| Mint Light | #DCFCE7 | ||
| Mint | #BBF7D0 | ||
| Seafoam | #86EFAC | ||
| Spring Green | #4ADE80 | ||
| Green | #22C55E | ||
| Grass | #16A34A | ||
| Forest | #15803D | ||
| Dark Green | #166534 | ||
| Pine | #14532D | ||
| Emerald Light | #ECFDF5 | ||
| Emerald Pale | #D1FAE5 | ||
| Emerald Soft | #A7F3D0 | ||
| Emerald | #6EE7B7 | ||
| Jade | #34D399 | ||
| Teal Green | #10B981 | ||
| Sea Green | #059669 | ||
| Ocean Green | #047857 | ||
| Deep Green | #065F46 | ||
| Hunter | #064E3B |
Triadic color harmony
Three evenly spaced hues create a colorful but balanced starting palette.
Text contrast
These ratios use the WCAG relative luminance formula.
White textNaN:1
Black textNaN:1
Ways to use green
01
Success and confirmation states
02
Sustainability and wellness brands
03
Financial charts and dashboards