#AAE080

Accessibility

AAA

13.68:1

Vs white / black

1.53:1 · 13.68:1

Sources

Library color

Codes

Formats

HEX

#aae080

RGB

rgb(170, 224, 128)

RGBA

rgba(170, 224, 128, 1)

HSL

hsl(94, 61%, 69%)

HSLA

hsla(94, 61%, 69%, 1)

HSV

hsv(94, 43%, 88%)

LAB

lab(83.66% -33.82 41.43)

LCH

lch(83.66% 53.48 129.23)

OKLAB

oklab(0.8474 -0.093 0.101)

OKLCH

oklch(0.8474 0.1373 132.64)

XYZ

xyz(47.13, 63.41, 30.18)

CMYK

cmyk(24%, 0%, 43%, 12%)

CSS

color: #aae080;

CSS variable

--color-aae080: #aae080;

SCSS

$color-aae080: #aae080;

JavaScript

const color = "#aae080";

TypeScript

const color: string = "#aae080";

React

style={{ backgroundColor: "#aae080" }}

JSON

{ "hex": "#aae080", "rgb": { "r": 170, "g": 224, "b": 128 }, "oklch": "oklch(0.8474 0.1373 132.64)" }

Export

Developer code

css

:root {
  --#aae080-1: #aae080;
}

Design systems

Nearest official tokens

An arbitrary HEX is not an official Tailwind, Material, or Bootstrap color. Distance is CIEDE2000.

Nearest Tailwind color

lime-300

Very different · ΔE 7.4 · #BEF264

Nearest CSS named color

LightGreen

Very different · ΔE 6.15 · #90EE90

Nearest Material color

light-green-300

Noticeably different · ΔE 3.32 · #AED581

Nearest Bootstrap color

light

Very different · ΔE 26.87 · #F8F9FA

OKLCH

Perceptual 50–950 scale

Generated in OKLCH from this hex. Not an official Tailwind scale unless the hex itself is a Tailwind token.

50e0ffc8 100d1f6b7 200b9e49b 3009fcf7b 40080b355 500659738 600537f2c 700416520 800304d13 9001f3708 9500d2100

Palette

Tints & shades

Full scale from light tints through the base color into deep shades

f8fcf4 f1faea eaf7df e3f5d5 dcf2ca d5f0c0 cdedb5 c6eaaa bfe8a0 b8e595 b1e38b aae080 9ccd75 8ebb6b 80a860 719555 63834b 557040 475d35 394b2b 2b3820 1c2515 0e130b

Palette

Tints

Mixed toward white — soft backgrounds and highlights

f8fcf4 f1faea eaf7df e3f5d5 dcf2ca d5f0c0 cdedb5 c6eaaa bfe8a0 b8e595 b1e38b

Palette

Shades

Mixed toward black — depth, text, and emphasis

9ccd75 8ebb6b 80a860 719555 63834b 557040 475d35 394b2b 2b3820 1c2515 0e130b

Palette

Tones

Mixed toward neutral grey — muted UI surfaces

a6d880 a3d080 a0c880 9cc080 99b880 95b080 92a880 8ea080 8b9880 879080 848880

Harmony

Complementary

Opposite on the color wheel for contrast

#AAE080Stop 1 #B680E0Stop 2

Harmony

Analogous

Neighbors that sit comfortably together

#DAE080Stop 1 #AAE080Stop 2 #80E086Stop 3

Harmony

Triadic

Evenly spaced triad for vibrant sets

#AAE080Stop 1 #80AAE0Stop 2 #E080AAStop 3

Harmony

Split complementary

Base plus two accents beside the complement

#AAE080Stop 1 #8680E0Stop 2 #E080DAStop 3

Harmony

Monochromatic

Same hue, varied lightness and saturation

#2F5214Stop 1 #529023Stop 2 #75CD32Stop 3 #9EDC6FStop 4 #C8EBADStop 5

Using this color

Where #aae080 works

#AAE080 (#aae080) sits in the light green family at about 94° hue, 61% saturation, and 69% lightness. Contrast is 1.53:1 on white and 13.68:1 on black, so near-black labels read more clearly on the swatch itself. Nearest Tailwind token: lime-300 (approximation unless the hex is an official scale stop).

Sensible jobs for this swatch

supporting UI accents
text or icons on charcoal / dark mode

Do not use #aae080 as small body text on white — 1.53:1 misses WCAG AA (4.5:1). Pair it with a darker shade from the scale below, or check pairs in the contrast checker.

Family context: Vitality, optimism, and renewal. Friendly for outdoor and lifestyle brands. Common uses still include buttons, charts, and accents in the Light Green range — always verify the pair for this exact hex in the contrast checker.

Similar & related colors

Nearby colors from the library by perceptual distance

Spectrum #A5DF81#A5DF81 Spectrum #ADE37D#ADE37D Spectrum #9DD981#9DD981 Spectrum #B5E779#B5E779 Spectrum #B2D77F#B2D77F Material Light Green 300#AED581 Spectrum #9EEA81#9EEA81 Spectrum #98E684#98E684 Spectrum #B9DC7A#B9DC7A Spectrum #A4EE7C#A4EE7C Spectrum #ABD283#ABD283 Spectrum #98D585#98D585