A vivid medium green, white text passes AA
What color is green?
green is a vivid medium green: #008000 in hex, rgb(0 128 0). White text on it reaches 5.14:1, passing WCAG AA. Recolor (recolor.page) shows it on a real page below.
Last updated
| Format | Value |
|---|---|
| Keyword | green |
| Hex | #008000 |
| RGB | rgb(0 128 0) |
| HSL | hsl(120 100% 25%) |
| OKLCH | oklch(52.0% 0.177 142.5) |
| Nearest Tailwind color | green-700 #008236, 0.034 away in OKLab |
| White text | 5.14:1: AA passes, AAA fails, large text passes |
| Black text | 4.09:1: AA fails, AAA fails, large text passes |
About green
In OKLCH terms green has a lightness of 52.0%, a chroma of 0.177 and a hue of 142.5 degrees, a vivid medium green to the eye. It is one of the 16 named colors that CSS Color 4 traces to the VGA palette, by way of HTML; most of the others came from the X11 color system.
HSL puts its lightness at 25% and OKLCH at 52.0%, 27 points apart: HSL's lightness does not follow what the eye sees, OKLCH's is built to. Among the CSS keywords, forestgreen (#228b22) comes closest at 0.039 in OKLab, close enough to stand in for it in a sketch.
With white text, green passes AA at 5.14:1. Black text, at 4.09:1, does not. In the hue-sorted table of named colors it sits between forestgreen and darkgreen.
In Tailwind CSS 4.3.3 the nearest default color is green-700 (#008236), 0.034 away in OKLab; for the exact color, an arbitrary value such as bg-[#008000] works.
Tints and shades
- #daead8
- #b5d5b2
- #90c08c
- #6bab66
- #43953e
- #008000
- #006300
- #004800
- #002e00
- #001600
- #000300
From light to dark: 5 toward white and 5 toward black, mixed in OKLCH a sixth of the way at a time with the hue kept. A step that would repeat its neighbor is left out.
A palette around it
- #008000
- #9dc062
- #19254f
- #f8d3e2
- #398c8d
Locked as the first of five swatches, green gets #9dc062, #19254f, #f8d3e2, #398c8d from Recolor's generator, a free palette, hues spread around the wheel. The seed is its hex, so the palette stays the same. Open it in Recolor.
Using green
As a text color, green on a white page gives the same 5.14:1.
.notice {
background-color: green; /* #008000 */
color: white; /* 5.14:1 */
}Common questions
Does white text pass WCAG AA on green?
Yes. White text measures 5.14:1 on green, above the 4.5:1 that WCAG AA asks of body text.
Can green be written in OKLCH?
Yes: oklch(52.0% 0.177 142.5), computed from #008000. A named color is an sRGB color, so its OKLCH value converts back to the same hex.
Is there a named color close to green?
Yes: forestgreen (#228b22) is the nearest, 0.039 away in OKLab, then seagreen at 0.082.