Maroon Colors  ·  Color Library

Palettes / Colors / #00A300

#00A300 — Vivid Green

#00A300 is a green color we call Vivid Green, closest to the named color Green (#008000). It belongs to the green family.

#00A300 is a warm-leaning green color associated with growth, calm and balance. It is saturated enough to be the accent — buttons, highlights and calls to action — while neutrals do the quiet work around it.

Its strongest partner is its complement #A300A3; it also sits naturally between #52A300 and #00A352. In the palettes below you can see it working alongside real color combinations from our collection.

#00A300 · RGB 0, 163, 0

Download PNG swatch SVG

Color values

HEX#00A300
RGB0, 163, 0
HSL120°, 100%, 32%
HSV120°, 100%, 64%
CMYK100%, 0%, 100%, 36%
XYZ13.10, 26.19, 4.37
Yxy26.19, 0.3000, 0.6000
CIE-Lab58.22, -61.66, 59.51
Hunter Lab51.18, -41.81, 29.06

RGB & CMYK percentages

Red 0% · Green 64% · Blue 0%

Cyan 100% · Magenta 0% · Yellow 100% · Key 36%

Previews

Sample text in #00A300 on black
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Sample text in #00A300 on white
Lorem ipsum dolor sit amet, consectetur adipiscing elit.

CSS code for #00A300

.text { color: #00A300; }
.background { background-color: #00A300; }
.border { border: 3px solid #00A300; }
.text-rgb { color: rgb(0, 163, 0); }
.text-hsl { color: hsl(120, 100%, 32%); }
.text-shadow-hex { text-shadow: 4px 4px 2px #00A300; }
.text-shadow-rgba { text-shadow: 4px 4px 2px rgba(0, 163, 0, 0.8); }
.box-shadow-hex { box-shadow: 1px 1px 3px 2px #00A300; }
.box-shadow-rgba { box-shadow: 1px 1px 3px 2px rgba(0, 163, 0, 0.8); }

HTML: <p style="color:#00A300">Text here</p> · <div style="background-color:#00A300">Div content here</div>

Shades of #00A300

#009400#008500#007A00#006B00#005C00#004D00#003D00#003300#002400#001400

Tints of #00A300

#00C200#00E600#05FF05#29FF29#47FF47#66FF66#8AFF8A#A8FFA8#CCFFCC#EBFFEB

Tones of #00A300

#0B980B#188C18#238023#2F752F#3A693A#465D46

Color harmonies

Complementary — #A300A3:

Analogous:

Triadic:

Contrast & accessibility

Against white text3.37:1 AA large only
Against black text6.24:1 AA

Best text color on #00A300: #000000.

How #00A300 looks with color blindness

Simulated with standard Machado color-vision-deficiency matrices — useful when this color carries meaning in charts, maps or interfaces:

Protanopia · #474827Deuteranopia · #3D3131Tritanopia · #08474D

Closest design-system colors

The nearest matches in the Tailwind CSS, Material Design and Bootstrap palettes — handy when you need a framework class instead of a raw hex:

Tailwind green 600 · #16A34ABootstrap success · #198754Tailwind lime 600 · #65A30D

Palettes with #00A300 or a close neighbour

Palette 059212
#059212 · #06D001 · #9BEC00 · #F3FF90
Amber Ruby Drift
#0B840D · #2FED51 · #EC24E9 · #F2A4EA
Vivid Ruby Monsoon
#7DED85 · #37D742 · #16971F · #0D4411
Burning Ruby Opal
#19A220 · #5BE57E · #E661E0 · #F2C6EE
Palette 08cb00
#08CB00 · #253900 · #000000 · #EEEEEE
Wild Ruby Cinder
#17BC17 · #34E65E · #E73CE7 · #F1B6F1

Similar colors

The closest colors that actually appear in our palette collection — click any to open its page:

#059212#0B840D#16971F#19A220#08CB00#17BC17#15830F#15901E#179721#1F9016#1FB419#15A026

Browse neighbouring colors

← #00A2FF  ·  #00A301 →

Frequently asked questions

What color is #00A300?

#00A300 is Vivid Green, a green color (RGB 0, 163, 0). Its closest standard named color is Green.

What is the RGB and HSL of #00A300?

#00A300 is RGB 0, 163, 0 — HSL 120°, 100%, 32% — CMYK 100%, 0%, 100%, 36%.

What colors go with #00A300?

Its complement is #A300A3; analogous partners are #52A300 and #00A352. It also appears in 6+ palettes in our collection.

Can I use #00A300 for text?

Black text on #00A300 has a contrast ratio of 6.24:1 (passes WCAG AA); white text gives 3.37:1.