Shades of Green: Hex, RGB, and HSL Codes

What counts as a shade of green?

Green covers more of the visible spectrum than any other family, and at 24 shades this is the longest list on the site. It runs from PaleGreen #98FB98 and LightGreen #90EE90 at the top, through the electric middle — Chartreuse #7FFF00, Lime #00FF00, SpringGreen #00FF7F — into the jewel tones Emerald #50C878 and Jade #00A36C, and out the bottom via ForestGreen #228B22, Hunter Green #355E3B, and DarkGreen #006400.

The family really splits by which neighbor it leans on. Yellow-greens like GreenYellow #ADFF2F, YellowGreen #9ACD32, and OliveDrab #6B8E23 feel organic and slightly acidic; blue-greens like MediumSeaGreen #3CB371 and Jade feel cool and clinical. Sage #9CAF88 and Army Green #454B1B sit apart from both — they are greens with the saturation pulled almost out, which is exactly why they read as sophisticated rather than loud.

How to use these color codes

1. Find your shade. The list runs roughly light to dark, with a live preview beside every name — scan it the way you would a paint chart.
2. Click a code to copy. Each row carries the hex, RGB, and HSL value of that color. One click copies that exact string to your clipboard.
3. Paste it into your project. Drop the hex into CSS, Figma, Photoshop, or a document. Clicking the swatch itself copies the hex, so you can grab colors without aiming at the small text.

What green communicates

Green is the color of permission. Go signals, success states, and confirmation checkmarks are green in nearly every interface convention, and the association is strong enough that a green error message reads as a contradiction.

Its second meaning is growth in both senses — botanical and financial. Sage and Fern #4F7942 carry the natural, sustainable, calming register that wellness and organic brands live in, while the deeper Emerald and ForestGreen signal money, stability, and establishment. Green is also the most restful hue for the eye, sitting at the center of the spectrum where the eye focuses with the least effort, which is why it works for large areas that other saturated colors could not survive.

Honest limitations

A hex code is exact, but the color you see is not. The same #FF0000 looks different on an OLED phone, a cheap office monitor, and a printed page, because each device has its own gamut and calibration. Treat these values as a precise starting point for screens, and always check a physical proof before committing a color to print — CMYK cannot reproduce every shade listed here.

Color names are a mix of two things. Entries badged CSS are official CSS named colors: the name itself works in a stylesheet and every browser resolves it to exactly that hex. The rest are conventional names — Burgundy, Sage, Espresso — that no standards body owns. Their hex values follow the most widely cited convention, but another chart may place them a few percent lighter or darker, so quote the hex rather than the name when the exact value matters.

Why is it free?

FreeToGenerate.com keeps every tool genuinely free. This page is a static list of color values rendered in your browser — nothing to install, no account, no premium tier holding back the darker half of the palette. Copy as many codes as you need, as often as you need.

Other color families

redorangeyellowcyanbluepurplepinkbrowngrayblackwhiteAll color families