← Back to Editor

#C2DF97 · #97C453 · #4E8B3F · #2B4611 · #49203A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#C2DF97

Willow Green · Tan · Apple Green

HEX
#C2DF97
RGB
rgb(194, 223, 151)
HSL
hsl(84, 53%, 73%)
HSB
hsb(84, 32%, 87%)
CMYK
cmyk(13%, 0%, 32%, 13%)
Oklch
oklch(86.5% 0.100 126.2)

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

#97C453

Grass Green · DarkSeaGreen · Olive Green

HEX
#97C453
RGB
rgb(151, 196, 83)
HSL
hsl(84, 49%, 55%)
HSB
hsb(84, 58%, 77%)
CMYK
cmyk(23%, 0%, 58%, 23%)
Oklch
oklch(76.5% 0.151 127.8)

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

#4E8B3F

Celadon · DarkOliveGreen · Forest Green

HEX
#4E8B3F
RGB
rgb(78, 139, 63)
HSL
hsl(108, 38%, 40%)
HSB
hsb(108, 55%, 55%)
CMYK
cmyk(44%, 0%, 55%, 45%)
Oklch
oklch(57.7% 0.126 139.7)

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

#2B4611

Pine Green · DarkGreen · Dark Green

HEX
#2B4611
RGB
rgb(43, 70, 17)
HSL
hsl(91, 61%, 17%)
HSB
hsb(91, 76%, 27%)
CMYK
cmyk(39%, 0%, 76%, 73%)
Oklch
oklch(36.0% 0.085 132.5)

Traditional「Pine Green」· Paint「Dark Green」· Creative Blush Sunrise

#49203A

Rose Purple · DarkSlateGray · Raspberry

HEX
#49203A
RGB
rgb(73, 32, 58)
HSL
hsl(322, 39%, 21%)
HSB
hsb(322, 56%, 29%)
CMYK
cmyk(0%, 56%, 21%, 71%)
Oklch
oklch(31.1% 0.072 343.3)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C2DF97
B396DF

Analogous

DFD796
C2DF97
9DDF96

Triadic

C2DF97
96C1DF
DF96C1

Split-Comp.

C2DF97
969DDF
D796DF

Tetradic

C2DF97
96DFD7
B396DF
DF969D

Contrast Matrix WCAG 2.1 Contrast

C2DF97
97C453
4E8B3F
2B4611
49203A
—
1.4
Fail
2.8
Fail
7.2
AAA
9.2
AAA
1.4
Fail
—
2.0
Fail
5.2
AA
6.7
AA
2.8
Fail
2.0
Fail
—
2.6
Fail
3.3
AA Large
7.2
AAA
5.2
AA
2.6
Fail
—
1.3
Fail
9.2
AAA
6.7
AA
3.3
AA Large
1.3
Fail
—
White BG
1.5Fail
2.0Fail
4.1AA Large
10.6AAA
13.5AAA
Black BG
14.3AAA
10.3AAA
5.1AA
2.0Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCFA8
AAAB6E
686951
37371E
373734

Deuteranopia

CDCBAD
A8A575
656056
353321
3A3D32

Tritanopia

C3B6B9
998489
516063
2C282A
472F2E

Achromatopsia

CECECE
AAAAAA
707070
383838
2F2F2F

Shades & Tints Shades & Tints

#C2DF97

Dark
Light

#97C453

Dark
Light

#4E8B3F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c2df97;
  --color-2: #97c453;
  --color-3: #4e8b3f;
  --color-4: #2b4611;
  --color-5: #49203a;
}

SCSS

$color-1: #c2df97;
$color-2: #97c453;
$color-3: #4e8b3f;
$color-4: #2b4611;
$color-5: #49203a;

TAILWIND

colors: {
  'brand-1': '#c2df97',
  'brand-2': '#97c453',
  'brand-3': '#4e8b3f',
  'brand-4': '#2b4611',
  'brand-5': '#49203a',
}

RGB Array

[194, 223, 151], [151, 196, 83], [78, 139, 63], [43, 70, 17], [73, 32, 58]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C2DF97, #97C453, #4E8B3F, #2B4611, #49203A is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #c2df97; --color-2: #97c453; --color-3: #4e8b3f; --color-4: #2b4611; --color-5: #49203a. 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 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