CSS Color: ForestGreen
Named CSS color ForestGreen — #228B22 in HEX, rgb(34, 139, 34) in RGB, hsl(120, 61%, 34%) in HSL.
Color Values
| Format | Value | CSS Usage |
|---|---|---|
| Named | ForestGreen | color: ForestGreen; |
| HEX | #228B22 | color: #228B22; |
| RGB | rgb(34, 139, 34) | color: rgb(34, 139, 34); |
| HSL | hsl(120, 61%, 34%) | color: hsl(120, 61%, 34%); |
About ForestGreen
ForestGreen is a natural, medium-dark green inspired by the deep colors of forest canopies. Its hex value `#228B22` includes a small amount of red (34) and blue (34) alongside 139 green, placing it at 120 degrees hue but with only 61% saturation and 34% lightness.
In web design, ForestGreen strikes an excellent balance between being clearly green and being dark enough for practical use. It achieves approximately 4.7:1 contrast against white, passing WCAG AA for normal text. This makes it one of the most usable greens for text and UI elements on light backgrounds.
ForestGreen is a natural fit for organic brands, environmental organizations, outdoor recreation sites, and sustainable product pages. Its slightly desaturated character feels more sophisticated and trustworthy than brighter greens.
ForestGreen sits between CSS Green and DarkGreen in the lightness spectrum. It pairs well with cream, sand, gold, light gray, and warm whites. In Tailwind CSS, `green-700` is the closest match for this balanced, natural green.
FAQ
What is the hex code for ForestGreen?
The CSS named color ForestGreen has the hex code #228B22. You can use it in CSS as color: #228B22; or simply color: ForestGreen;.
What is ForestGreen in RGB?
In RGB notation, ForestGreen is rgb(34, 139, 34). Use it in CSS as color: rgb(34, 139, 34);.
What is ForestGreen in HSL?
In HSL notation, ForestGreen is hsl(120, 61%, 34%). Use it in CSS as color: hsl(120, 61%, 34%);.
What color category is ForestGreen?
ForestGreen belongs to the Green color family in the CSS named colors specification.
Can I use the name "ForestGreen" directly in CSS?
Yes. All modern browsers support CSS named colors. You can write color: ForestGreen; or background-color: ForestGreen; directly in your stylesheet. Named colors are case-insensitive.
Related Colors
Try in Color Converter
Convert ForestGreen to other formats, check contrast ratios, explore palettes, and find the closest Tailwind CSS class.
Open Color Converter →