CSS Color: Green

Named CSS color Green #008000 in HEX, rgb(0, 128, 0) in RGB, hsl(120, 100%, 25%) in HSL.

GreenGreen

Color Values

FormatValueCSS Usage
NamedGreencolor: Green;
HEX#008000color: #008000;
RGBrgb(0, 128, 0)color: rgb(0, 128, 0);
HSLhsl(120, 100%, 25%)color: hsl(120, 100%, 25%);

About Green

Green in CSS is not the bright green most people expect — it is actually a dark, forest-like green at `#008000`. With zero red and blue, a green channel of 128, and only 25% lightness in HSL, it is significantly darker than Lime (`#00FF00`) which is what most people picture as "green."

In web design, Green is universally associated with success, confirmation, and positive actions. It is the standard color for success messages, checkmarks, online status indicators, and proceed buttons. This particular shade of CSS Green is dark enough for good contrast against white (approximately 5.1:1), making it usable for text.

From an accessibility standpoint, CSS Green passes WCAG AA for normal text and AA for large text against white backgrounds. This makes it one of the few saturated colors that can be used directly for colored text on light backgrounds.

Green pairs naturally with white, light gray, and cream. Red is its complement, so red-green combinations should be avoided for color-blind users (about 8% of males have red-green color vision deficiency). In Tailwind CSS, `green-700` provides a very close match.

FAQ

What is the hex code for Green?

The CSS named color Green has the hex code #008000. You can use it in CSS as color: #008000; or simply color: Green;.

What is Green in RGB?

In RGB notation, Green is rgb(0, 128, 0). Use it in CSS as color: rgb(0, 128, 0);.

What is Green in HSL?

In HSL notation, Green is hsl(120, 100%, 25%). Use it in CSS as color: hsl(120, 100%, 25%);.

What color category is Green?

Green belongs to the Green color family in the CSS named colors specification.

Can I use the name "Green" directly in CSS?

Yes. All modern browsers support CSS named colors. You can write color: Green; or background-color: Green; directly in your stylesheet. Named colors are case-insensitive.

Try in Color Converter

Convert Green to other formats, check contrast ratios, explore palettes, and find the closest Tailwind CSS class.

Open Color Converter →