Avocado Green

#568203

What color is Avocado Green?

Avocado green is a dark, muted yellow-green with strong earthy undertones, hex #568203, close to the skin of a ripe avocado. The color has a dry, slightly dusty quality that keeps it from reading as bright or lime-like.

What is the meaning of the color Avocado Green?

Named directly after the avocado fruit, the color gained its strongest cultural foothold in the late 1960s and 1970s, when it became a standard finish for kitchen appliances across the United States. Manufacturers including General Electric and Whirlpool offered avocado green as a premium color option alongside harvest gold, positioning both as modern alternatives to white. The shade appeared in the 1972 Sears catalog as a featured appliance color, reflecting the decade’s preference for earthy, nature-adjacent interiors. It has since become a documented marker of 1970s American domestic design, referenced in museum collections including the Henry Ford.

RGB
86, 130, 3
HSL
81°, 95%, 26%
CMYK
34, 0, 98, 49
HSV
81°, 98%, 51%
Avocado green color

What colors go with Avocado Green?

Colors that pair well with Avocado green include:
Cream: soft, warm contrast
Burnt orange: bold earthy warmth
Navy blue: sharp, grounding depth
Tan: quiet, natural balance
Mustard yellow: rich tonal harmony

Similar Colors

Conversions & Codes

Format Value CSS
HEX #568203 color: #568203;
RGB 86, 130, 3 color: rgb(86, 130, 3);
RGB Percentage 34%, 51%, 1% color: rgb(34%, 51%, 1%);
CMYK 34%, 0%, 98%, 49% Not supported in CSS
HSL 81°, 95%, 26% color: hsl(81, 95%, 26%);
HSV 81°, 98%, 51% Not supported in CSS
CIE-LAB 21, -9, 42 color: lab(21% -9 42);
Decimal 5669379 Not supported in CSS

Color Variations

Shades

#558103
#4D7403
#446703
#3C5A02
#334E02
#2B4102
#223401
#1A2701

Tints

#D7FC91
#C9FB6C
#BCFA47
#AEF922
#9EF006
#86CB05
#6DA604
#558103

Tones

#558103
#537B0A
#517510
#506E16
#4E681D
#4C6223
#4A5B29
#48552F

Hues

#558103
#038110
#03816E
#033681
#2F0381
#810375
#810316
#814F03

Color Harmonies

Analogous

#816E03
Click to copy
#568203
Click to copy
#168103
Click to copy

Complementary

#568203
Click to copy
#2F0381
Click to copy

Split Complementary

#568203
Click to copy
#031681
Click to copy
#6E0381
Click to copy

Triadic

#568203
Click to copy
#035581
Click to copy
#810355
Click to copy

Tetradic

#568203
Click to copy
#03816E
Click to copy
#2F0381
Click to copy
#810316
Click to copy

Square

#568203
Click to copy
#03816E
Click to copy
#2F0381
Click to copy
#810316
Click to copy

CSS & Dev Snippets

CSS
.avocado-green {
  color: #568203;
}
SCSS
$avocado-green: #568203;
RGB
rgb(86, 130, 3)

Accessibility & Contrast

White background

4.58:1
4.58
contrast ratio on a white background
Element
AA
AAA
Small text
Large text
UI element

Black background

4.59:1
4.59
contrast ratio on a black background
Element
AA
AAA
Small text
Large text
UI element

Popular Tags