← Back to Editor

#A7CD2C · #C4E178 · #E1F5C4 · #77B793 · #0D7961

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#A7CD2C

Grass Green · GreenYellow · Olive Green

HEX
#A7CD2C
RGB
rgb(167, 205, 44)
HSL
hsl(74, 65%, 49%)
HSB
hsb(74, 79%, 80%)
CMYK
cmyk(19%, 0%, 79%, 20%)
Oklch
oklch(79.3% 0.181 122.7)

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

#C4E178

Willow Green · Khaki · Apple Green

HEX
#C4E178
RGB
rgb(196, 225, 120)
HSL
hsl(77, 64%, 68%)
HSB
hsb(77, 47%, 88%)
CMYK
cmyk(13%, 0%, 47%, 12%)
Oklch
oklch(86.6% 0.136 122.0)

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

#E1F5C4

Willow Green · Beige · Mint Green

HEX
#E1F5C4
RGB
rgb(225, 245, 196)
HSL
hsl(84, 71%, 86%)
HSB
hsb(84, 20%, 96%)
CMYK
cmyk(8%, 0%, 20%, 4%)
Oklch
oklch(94.3% 0.068 125.7)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#77B793

Celadon · DarkSeaGreen · Olive Green

HEX
#77B793
RGB
rgb(119, 183, 147)
HSL
hsl(146, 31%, 59%)
HSB
hsb(146, 35%, 72%)
CMYK
cmyk(35%, 0%, 20%, 28%)
Oklch
oklch(72.6% 0.084 158.8)

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

#0D7961

Mineral Blue · Teal · Mint Ice

HEX
#0D7961
RGB
rgb(13, 121, 97)
HSL
hsl(167, 81%, 26%)
HSB
hsb(167, 89%, 47%)
CMYK
cmyk(89%, 0%, 20%, 53%)
Oklch
oklch(51.5% 0.097 172.0)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A7CD2C
522CCE

Analogous

CEA32C
A7CD2C
57CE2C

Triadic

A7CD2C
2CA8CE
CE2CA8

Split-Comp.

A7CD2C
2C57CE
A32CCE

Tetradic

A7CD2C
2CCEA3
522CCE
CE2C57

Contrast Matrix WCAG 2.1 Contrast

A7CD2C
C4E178
E1F5C4
77B793
0D7961
—
1.3
Fail
1.6
Fail
1.3
Fail
2.9
Fail
1.3
Fail
—
1.3
Fail
1.6
Fail
3.7
AA Large
1.6
Fail
1.3
Fail
—
2.0
Fail
4.6
AA
1.3
Fail
1.6
Fail
2.0
Fail
—
2.3
Fail
2.9
Fail
3.7
AA Large
4.6
AA
2.3
Fail
—
White BG
1.8Fail
1.5Fail
1.2Fail
2.3Fail
5.4AA
Black BG
11.4AAA
14.4AAA
18.1AAA
9.0AAA
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B7B853
D1D191
EAEAD0
93939C
3C3D67

Deuteranopia

B5B25C
CFCD98
E9E7D3
8F8A9E
362D68

Tritanopia

A97278
C5A5AA
E2D9DB
7AA3A4
126B6C

Achromatopsia

AFAFAF
CCCCCC
E9E9E9
A0A0A0
565656

Shades & Tints Shades & Tints

#A7CD2C

Dark
Light

#C4E178

Dark
Light

#E1F5C4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a7cd2c;
  --color-2: #c4e178;
  --color-3: #e1f5c4;
  --color-4: #77b793;
  --color-5: #0d7961;
}

SCSS

$color-1: #a7cd2c;
$color-2: #c4e178;
$color-3: #e1f5c4;
$color-4: #77b793;
$color-5: #0d7961;

TAILWIND

colors: {
  'brand-1': '#a7cd2c',
  'brand-2': '#c4e178',
  'brand-3': '#e1f5c4',
  'brand-4': '#77b793',
  'brand-5': '#0d7961',
}

RGB Array

[167, 205, 44], [196, 225, 120], [225, 245, 196], [119, 183, 147], [13, 121, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A7CD2C, #C4E178, #E1F5C4, #77B793, #0D7961 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #a7cd2c; --color-2: #c4e178; --color-3: #e1f5c4; --color-4: #77b793; --color-5: #0d7961. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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