HomeDevGreen color codes
Color tools

Green color codes

Green color codes for #008000 — HEX, RGB, HSL, HSV, shades, named greens, and copy-ready CSS. Free online tool — no sign-up. Runs locally in your browser.

Loading tool…

Loading Preparing tool…

How to use

Follow these steps for a clear answer.

1

Explore the base color

Review HEX, RGB, HSL, and HSV for green, then browse shades, tints, tones, and hues.

2

Pick a variation or named shade

Click a generated strip or a CSS named green shade to load codes and harmonies.

3

Copy for CSS

Copy HEX, rgb(), hsl(), or the keyword—and check contrast on white and black.

Color formulas

Core relationships used by this color tool.

CSS green#008000 = rgb(0, 128, 0) = hsl(120°, 100%, 25%)
Shadesame H/S, lower L (mix toward black)
Tintsame H/S, higher L (mix toward white)
ComplementH + 180° (magenta/red-violet)
iHSV (or HSB) keeps hue with saturation and value; HSL uses lightness. Named shades in this family follow CSS Color Module keywords.

Example colors

Common picks with formula and result.

ϟ

Base green

CSS keyword

color: green;
#008000 · rgb(0, 128, 0)
ϟ

Related shade

Family neighbor

lime
#00FF00
ϟ

UI accent

Background use

background-color: #008000;
Pair with readable text
ϟ

Complement direction

Harmony hint

H + 180°
Toward magenta/red-violet

Green color family specification

Version 1.0.0

Definition
Green in CSS centers on the keyword green (#008000 / rgb(0, 128, 0) / hsl(120°, 100%, 25%)). Designers use green families for growth, success, and nature on screens.
What it calculates
Green family variations (shades, tints, tones, hues), named CSS shades, harmony sets, HEX/RGB/HSL/HSV codes, and contrast vs white/black.
Inputs
  • Selected variation chip, named shade, or harmony swatch
  • Section mode (variations, named shades, harmonies)
Outputs
  • HEX, RGB, HSL, HSV
  • Optional CSS keyword
  • Contrast ratios on white and black
Formula
Shades/tints/tones adjust HSL L or S from base H; harmonies offset H on the hue circle

Green marks success and eco themes. Remember CSS green ≠ lime: green is darker and more traditional.

For full keyword search across all hues, use HTML color codes. For palette generation, try the color scheme generator or color wheel.

:root {
  --green: #008000;
  --green-bright: #32cd32;
  --green-deep: #006400;
}

.banner {
  background-color: var(--green);
  color: #ffffff;
}
Popular CSS greens
NameHEXRGBFeel
green#0080000, 128, 0Base keyword
lime#00FF000, 255, 0Named shade
limegreen#32CD3250, 205, 50Named shade
forestgreen#228B2234, 139, 34Named shade
seagreen#2E8B5746, 139, 87Named shade
olive#808000128, 128, 0Named shade
teal#0080800, 128, 128Named shade
yellowgreen#9ACD32154, 205, 50Named shade
chartreuse#7FFF00127, 255, 0Named shade
darkgreen#0064000, 100, 0Dark shade
darkolivegreen#556B2F85, 107, 47Dark shade
darkseagreen#8FBC8F143, 188, 143Dark shade
i Related hues may appear in Named shades when useful for green-adjacent palettes.
Assumptions
  • Base keyword green = #008000 in sRGB.
  • Named list uses CSS Color Module keywords in/near the green family.
  • Tool runs locally; nothing is uploaded.
Units
  • HEX: #RRGGBB
  • RGB: 0–255
  • HSL/HSV: hue degrees; S/L/V percent
Boundary conditions
  • Lightness/saturation steps stay within visible ranges (~0–100%).
  • Hue offsets wrap modulo 360°.
Example
green → #008000; complementary toward magenta/red-violet
Validation cases
  • green → #008000
  • lime → #00FF00
  • shade of green → same hue, lower lightness
  • tint of green → same hue, higher lightness
Sources
  • CSS Color Module named colors (green family)
  • Classical shade/tint/tone and hue-harmony geometry
  • WCAG relative-luminance contrast
Calculation version
1.0.0
◉ Teal color codes › ◉ Yellow color codes › ◉ Cyan color codes › # HTML color codes › ◌ Color wheel ›

Frequently asked questions

Key distinctions behind the tool.

What is the hex code for green?

The CSS named color green is #008000, equal to rgb(0, 128, 0) and hsl(120°, 100%, 25%).

What is the difference between green and lime?

CSS green is a dark mid green (#008000). Lime is pure bright green (#00FF00)—very different on screen.

What colors go with green?

Cream, wood browns, and soft blues suit green. Lime accents add energy on dark UIs. Always check text contrast.

Is green good for body text?

Keyword green on white usually passes AA. Lime on white often fails—darken for text.

How do I use green in CSS?

Use color: green;, color: #008000;, or color: rgb(0, 128, 0); on any property that accepts a <color> value, including background-color and border-color.