← Back to Editor

#66E98E · #7AE080 · #8ED872 · #A2CF64 · #B6C756

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatile

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#66E98E

Emerald · MediumAquaMarine · Apple Green

HEX
#66E98E
RGB
rgb(102, 233, 142)
HSL
hsl(138, 75%, 66%)
HSB
hsb(138, 56%, 91%)
CMYK
cmyk(56%, 0%, 39%, 9%)
Oklch
oklch(83.8% 0.172 151.0)

Traditional「Emerald」· Paint「Apple Green」· Creative Mint Breeze

#7AE080

Emerald · LightGreen · Apple Green

HEX
#7AE080
RGB
rgb(122, 224, 128)
HSL
hsl(124, 62%, 68%)
HSB
hsb(124, 46%, 88%)
CMYK
cmyk(46%, 0%, 43%, 12%)
Oklch
oklch(82.2% 0.163 145.1)

Traditional「Emerald」· Paint「Apple Green」· Creative Mint Breeze

#8ED872

Emerald · LightGreen · Apple Green

HEX
#8ED872
RGB
rgb(142, 216, 114)
HSL
hsl(104, 57%, 65%)
HSB
hsb(104, 47%, 85%)
CMYK
cmyk(34%, 0%, 47%, 15%)
Oklch
oklch(81.0% 0.154 137.7)

Traditional「Emerald」· Paint「Apple Green」· Creative Mint Breeze

#A2CF64

Grass Green · DarkSeaGreen · Olive Green

HEX
#A2CF64
RGB
rgb(162, 207, 100)
HSL
hsl(85, 53%, 60%)
HSB
hsb(85, 52%, 81%)
CMYK
cmyk(22%, 0%, 52%, 19%)
Oklch
oklch(79.9% 0.145 128.2)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#B6C756

Autumn Sage · Tan · Sunflower

HEX
#B6C756
RGB
rgb(182, 199, 86)
HSL
hsl(69, 50%, 56%)
HSB
hsb(69, 57%, 78%)
CMYK
cmyk(9%, 0%, 57%, 22%)
Oklch
oklch(79.4% 0.139 116.8)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

66E98E
E967C2

Analogous

81E967
66E98E
67E9CF

Triadic

66E98E
8E67E9
E98E67

Split-Comp.

66E98E
CF67E9
E96781

Tetradic

66E98E
6781E9
E967C2
E9CF67

Contrast Matrix WCAG 2.1 Contrast

66E98E
7AE080
8ED872
A2CF64
B6C756
—
1.1
Fail
1.1
Fail
1.2
Fail
1.2
Fail
1.1
Fail
—
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
1.0
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.0
Fail
—
1.0
Fail
1.2
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
White BG
1.5Fail
1.6Fail
1.7Fail
1.8Fail
1.9Fail
Black BG
13.6AAA
12.8AAA
12.2AAA
11.6AAA
11.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9FA0A4
A6A797
AEAF8B
B5B67E
BDBE71

Deuteranopia

978DA9
A0999D
AAA491
B3B084
BCBB78

Tritanopia

6DB5B9
7FAAAE
929EA2
A49297
B7878C

Achromatopsia

B7B7B7
B7B7B7
B6B6B6
B5B5B5
B5B5B5

Shades & Tints Shades & Tints

#66E98E

Dark
Light

#7AE080

Dark
Light

#8ED872

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #66e98e;
  --color-2: #7ae080;
  --color-3: #8ed872;
  --color-4: #a2cf64;
  --color-5: #b6c756;
}

SCSS

$color-1: #66e98e;
$color-2: #7ae080;
$color-3: #8ed872;
$color-4: #a2cf64;
$color-5: #b6c756;

TAILWIND

colors: {
  'brand-1': '#66e98e',
  'brand-2': '#7ae080',
  'brand-3': '#8ed872',
  'brand-4': '#a2cf64',
  'brand-5': '#b6c756',
}

RGB Array

[102, 233, 142], [122, 224, 128], [142, 216, 114], [162, 207, 100], [182, 199, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #66E98E, #7AE080, #8ED872, #A2CF64, #B6C756 is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #66e98e; --color-2: #7ae080; --color-3: #8ed872; --color-4: #a2cf64; --color-5: #b6c756. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color