Green Color (#008000)

#008000rgb(0, 128, 0)

Green is a CSS named color defined as hex code #008000. In CSS, green is #008000, a medium-dark green with the green channel at half strength. It is not the bright screen green many people expect; that color is called lime (#00FF00).

Color Overview & Formats

CSS: greenLuminance: 0.1544
HEX
#008000
RGB
rgb(0, 128, 0)
HSL
hsl(120, 100%, 25%)
Green (#008000) Color Format Conversions
FormatSyntax / ValuesNotesAction
HEX#0080006-digit hex web code
RGBrgb(0, 128, 0)Red, Green, Blue channels (0-255)
HSLhsl(120, 100%, 25%)Hue (120°), Saturation (100%), Lightness (25%)
HSV / HSBhsv(120, 100%, 50%)Hue, Saturation (100%), Value/Brightness (50%)
CMYKcmyk(100%, 0%, 100%, 50%)Digital mathematical approximation (non-print)
OKLCHoklch(0.520 0.177 142.5)Perceptually uniform color space (CSS Color 4 approximation)
CSS Implementation & Quick Steps
background-color: #008000; /* or green */
  1. Select color format: Choose the desired format (HEX #008000, RGB, or HSL).
  2. Copy the code: Click the copy button or press Tab+Enter to store in clipboard.
  3. Pair with white text: White text on Green reaches 5.14:1 (WCAG AA).

What Colors Go With Green?

These 6 colors all go well with Green (#008000), and each one is a standard CSS named color. The ratio is the WCAG 2.2 contrast of that color on Green: at 4.5:1 or above it works for text; below that, use it for backgrounds and accents.

White

#FFFFFF
5.14:1Text-safe

The natural text color on green buttons and banners.

Ivory

#FFFFF0
5.09:1Text-safe

A softer, warmer alternative to white.

Wheat

#F5DEB3
3.91:1Background / accent

A warm beige for natural, earthy palettes.

Gold

#FFD700
3.66:1Background / accent

A rich accent, common in heritage and holiday designs.

Tan

#D2B48C
2.6:1Background / accent

An earthy neutral that matches the green.

Black

#000000
4.09:1Background / accent

Sharp, graphic contrast for bold layouts.

Harmonious Palettes & Tints

The palettes below are algorithmically generated across standard intervals based on Green (HSL 120°). Each group offers full palette copy and live preview:

Complementary Harmony

Hue rotated 180 degrees on the HSL wheel (120° to 300°), keeping the original saturation and lightness.

Green
#008000
Complement (300°)
#800080
Live UI Component Mockup
Component Header SampleWhite text on Green: 5.14:1 (WCAG AA).
Button style preview

Analogous Harmony

Hues 30 degrees either side (90° and 150°), keeping the original saturation and lightness.

Analogous (90°)
#408000
Green
#008000
Analogous (150°)
#008040
Live UI Component Mockup
Component Header SampleWhite text on Green: 5.14:1 (WCAG AA).
Button style preview

Triadic Harmony

Hues spaced evenly by 120 degrees (240° and 0°), keeping the original saturation and lightness.

Green
#008000
Triadic (240°)
#000080
Triadic (0°)
#800000
Live UI Component Mockup
Component Header SampleWhite text on Green: 5.14:1 (WCAG AA).
Button style preview

Tints & Shades

Mixed with white (tints) and black (shades) in sRGB at 60% and 30%.

Tint 60%
#99CC99
Tint 30%
#4DA64D
Green
#008000
Shade 30%
#005A00
Shade 60%
#003300
Live UI Component Mockup
Component Header SampleWhite text on Green: 5.14:1 (WCAG AA).
Button style preview

WCAG 2.2 Text Readability & Contrast Check

Under WCAG 2.2 criteria, regular body text requires at least 4.5:1 (AA) and large text requires at least 3.0:1. The table below displays calculated contrast ratios:

Text Contrast Ratios on Green (#008000)
Foreground ColorContrast RatioNormal Text (AA)Large Text (AA)Normal Text AAA (>= 7.0:1)
Pure Black (#000000)
4.09:1FailPassFail
Pure White (#FFFFFF)
5.14:1PassPassFail
Dark Charcoal (#212529)
3.00:1FailPassFail
Mid Gray (#666666)
1.12:1FailFailFail

Interactive Contrast Tester

Enter text foreground and background colors to verify WCAG legibility:

Calculated Ratio:
5.14:1
Normal: Pass AALarge: Pass AAA
Large Heading Sample (18pt Bold)

This is sample body text rendered directly to verify contrast and readability.

Green Background Download

Download standard 1920x1080 solid desktop wallpaper or generate mobile wallpaper:

Green 1920x1080 solid color background wallpaper previewStandard Wallpaper: 1920x1080 PNG (#008000)

Download Options

All wallpaper files precisely match the W3C standard color value:

Download 1920x1080 PNG

CSS Standard & Usage Notes

green = #008000 (rgb(0, 128, 0))
W3C CSS Color 4

UI Design & Accessibility Guidelines

Use it for success messages, confirmation buttons, and nature and eco themes. On Green, white text passes WCAG AA at every size (5.14:1); black text passes only for large text (4.09:1).

Published: · Modified: · Editorial: SwatchAtlas Editorial Team

Frequently Asked Questions (FAQ)

Can I use black text on Green?

Only for large text. Black text on Green has a WCAG 2.2 contrast ratio of 4.09:1: enough for large text (3:1) but below the 4.5:1 needed for body text.

Can I use white text on Green?

Yes. White text on Green has a WCAG 2.2 contrast ratio of 5.14:1, which passes AA (4.5:1) for all text sizes but not the stricter AAA level (7:1) for body text.

What colors go with Green?

White, Ivory, Wheat, Gold, Tan and Black all go well with Green. White (5.14:1) and Ivory (5.09:1) have enough contrast for text on Green; Wheat, Gold, Tan and Black work better as a background or accent.

Why is CSS green darker than lime?

CSS defines green as #008000, with the green channel at 128, and gives the full-strength #00FF00 the name lime. So the color most people picture as "screen green" is lime in CSS.