Shades of Green
with Hex Codes
Green is the colour of nature, growth, and life — and one of the most diverse colour families in design. In CSS, the base green is #008000, but designers use hundreds of variations: deep forest greens for natural brands, bright lime greens for energetic UIs, muted sage and olive for sophisticated palettes, and dark hunter greens for premium feels.
88+Color Shades
1-clickCopy Hex Code
3Filter Categories
Complete List of Green Color Shades
Click to copy
HTML
Green Yellow
#ADFF2F
Click to copy
HTML
Chartreuse
#7FFF00
Click to copy
HTML
Lawn Green
#7CFC00
Click to copy
HTML
Lime
#00FF00
Click to copy
HTML
Lime Green
#32CD32
Click to copy
HTML
Pale Green
#98FB98
Click to copy
HTML
Light Green
#90EE90
Click to copy
HTML
Medium Spring Green
#00FA9A
Click to copy
HTML
Medium Sea Green
#3CB371
Click to copy
HTML
Sea Green
#2E8B57
Click to copy
HTML
Forest Green
#228B22
Click to copy
HTML
Green
#008000
Click to copy
HTML
Dark Green
#006400
Click to copy
HTML
Yellow Green
#9ACD32
Click to copy
HTML
Olive Drab
#6B8E23
Click to copy
HTML
Olive
#808000
Click to copy
HTML
Dark Olive Green
#556B2F
Click to copy
HTML
Medium Aquamarine
#66CDAA
Click to copy
HTML
Dark Sea Green
#8FBC8B
Click to copy
HTML
Light Sea Green
#20B2AA
Click to copy
HTML
Dark Cyan
#008B8B
Click to copy
HTML
Teal
#008080
Click to copy
Artichoke
#8F9779
Click to copy
Artichoke Green
#4B6F44
Click to copy
Asparagus
#87A96B
Click to copy
Avocado
#568203
Click to copy
Fern Green
#4F7942
Click to copy
Fern
#71BC78
Click to copy
Jungle Green
#29AB87
Click to copy
Laurel Green
#A9BA9D
Click to copy
Mantis
#74C365
Click to copy
Mint
#3EB489
Click to copy
Moss Green
#8A9A5B
Click to copy
Dark Moss Green
#4A5D23
Click to copy
Myrtle Green
#317873
Click to copy
Pine Green
#01796F
Click to copy
Reseda Green
#6C7C59
Click to copy
Shamrock Green
#009E60
Click to copy
Tea Green
#D0F0C0
Click to copy
Emerald
#50C878
Click to copy
Green Earth
#DADD98
Click to copy
Hookers Green
#49796B
Click to copy
Jade
#00A86B
Click to copy
Malachite
#0BDA51
Click to copy
Pigment Green
#00A550
Click to copy
NCS Green
#009F6B
Click to copy
Munsell Green
#00A877
Click to copy
Pantone Green
#00AD83
Click to copy
Crayola Green
#1CAC78
Click to copy
Bright Green
#66FF00
Click to copy
Bright Mint
#4FFFB0
Click to copy
Erin
#00FF40
Click to copy
Dark Pastel Green
#03C03C
Click to copy
Harlequin
#3FFF00
Click to copy
Neon Green
#39FF14
Click to copy
Screamin Green
#76FF7A
Click to copy
Army Green
#4B5320
Click to copy
Bottle Green
#006A4E
Click to copy
Hunter Green
#355E3B
Click to copy
Kelly Green
#4CBB17
Click to copy
Persian Green
#00A693
Click to copy
Russian Green
#679267
Click to copy
Spanish Green
#009150
Click to copy
Pakistan Green
#01411C
Click to copy
India Green
#138808
Click to copy
Islamic Green
#009000
Click to copy
Recycling Green
#009900
Click to copy
Paris Green
#50C878
Click to copy
Celadon
#ACE1AF
Click to copy
Feldgrau
#4D5D53
Click to copy
UP Forest Green
#014421
Click to copy
Brand
John Deere Green
#367C2B
Click to copy
Brand
Whole Foods Green
#00674B
Click to copy
Brand
Spotify Green
#1DB954
Click to copy
Brand
Starbucks Green
#006241
Click to copy
Brand
Heineken Green
#008200
Click to copy
Brand
Android Green
#32DE84
Click to copy
Brand
Lacoste Green
#004526
Click to copy
Brand
GO Green
#00AB66
Click to copy
Sport
Celtic FC Green
#018749
Click to copy
Sport
Eagles Midnight Green
#004953
Click to copy
Sport
Jets Gotham Green
#00573F
Click to copy
Sport
MSU Green
#18453B
Click to copy
Sport
Sacramento State Green
#043927
Click to copy
Sport
UNT Green
#00853E
Click to copy
Sport
Dartmouth Green
#00693E
Click to copy
Sport
Castleton Green
#00563B
Click to copy
Sport
Brunswick Green
#1B4D3E
Shades of Green — Hex Reference Table
Click any hex code or colour swatch to copy it to your clipboard.
| Preview | Name | Hex Code | RGB | Category |
|---|
How to Use Shades of Green in CSS
Every shade on this page can be used directly in CSS. Copy the hex code and paste it into any CSS color property: color, background-color, border-color, box-shadow, or outline-color.
For transparency effects, convert the hex to RGB using the table above and use rgba(). For a design system, store your chosen shade as a CSS custom property so you can update it site-wide from one place.
/* Forest green button */
.btn { background-color: #228B22; color: #fff; }
/* Lime green accent */
.badge { background-color: #32CD32; }
/* Emerald with transparency */
.overlay { background-color: rgba(80, 200, 120, 0.2); }
/* CSS custom property */
:root { --brand-green: #1DB954; }
Frequently Asked Questions
What is the hex code for green?
The pure green hex code in HTML/CSS is
#008000. Lime green is #00FF00, forest green is #228B22, and dark green is #006400.What are the different shades of green called?
Popular green shades include lime, chartreuse, lawn green, forest green, sea green, olive, emerald, jade, mint, sage, hunter green, army green, kelly green, neon green, and teal.
What is the most popular shade of green?
Forest green (#228B22), emerald (#50C878), and lime green (#32CD32) are most popular. Spotify green (#1DB954) is the most recognised brand green globally.
What is the darkest shade of green?
Dark green (
#006400) is the darkest HTML named green. Others include hunter green (#355E3B), bottle green (#006A4E), and UP forest green (#014421).How do I use shades of green in CSS?
Use hex codes directly:
background-color: #228B22; for forest green. CSS named greens include green, lime, forestgreen, seagreen, and olive.