← Back to Editor

#7CC491 · #AEAF87 · #D2834A · #DB3B64 · #3C2029

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

#7CC491

Celadon · DarkSeaGreen · Apple Green

HEX
#7CC491
RGB
rgb(124, 196, 145)
HSL
hsl(138, 38%, 63%)
HSB
hsb(138, 37%, 77%)
CMYK
cmyk(37%, 0%, 26%, 23%)
Oklch
oklch(75.9% 0.103 152.6)

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

#AEAF87

Fresh Green · DarkSeaGreen · Sunflower

HEX
#AEAF87
RGB
rgb(174, 175, 135)
HSL
hsl(61, 20%, 61%)
HSB
hsb(61, 23%, 69%)
CMYK
cmyk(1%, 0%, 23%, 31%)
Oklch
oklch(74.3% 0.055 108.9)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#D2834A

Tangerine · Coral · Warm Sun

HEX
#D2834A
RGB
rgb(210, 131, 74)
HSL
hsl(25, 60%, 56%)
HSB
hsb(25, 65%, 82%)
CMYK
cmyk(0%, 38%, 65%, 18%)
Oklch
oklch(68.2% 0.122 54.8)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#DB3B64

Vermilion · MediumVioletRed · Passion Red

HEX
#DB3B64
RGB
rgb(219, 59, 100)
HSL
hsl(345, 69%, 55%)
HSB
hsb(345, 73%, 86%)
CMYK
cmyk(0%, 73%, 54%, 14%)
Oklch
oklch(60.1% 0.196 10.6)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#3C2029

Dark Violet · DarkSlateGray · Raspberry

HEX
#3C2029
RGB
rgb(60, 32, 41)
HSL
hsl(341, 30%, 18%)
HSB
hsb(341, 47%, 24%)
CMYK
cmyk(0%, 47%, 32%, 76%)
Oklch
oklch(28.4% 0.045 359.7)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7CC491
C57DAF

Analogous

8BC57D
7CC491
7DC5B6

Triadic

7CC491
927DC5
C5927D

Split-Comp.

7CC491
B67DC5
C57D8B

Tetradic

7CC491
7D8BC5
C57DAF
C5B67D

Contrast Matrix WCAG 2.1 Contrast

7CC491
AEAF87
D2834A
DB3B64
3C2029
—
1.1
Fail
1.4
Fail
2.1
Fail
7.1
AAA
1.1
Fail
—
1.3
Fail
1.9
Fail
6.5
AA
1.4
Fail
1.3
Fail
—
1.5
Fail
5.0
AA
2.1
Fail
1.9
Fail
1.5
Fail
—
3.4
AA Large
7.1
AAA
6.5
AA
5.0
AA
3.4
AA Large
—
White BG
2.1Fail
2.3Fail
3.0Fail
4.4AA Large
14.7AAA
Black BG
10.2AAA
9.3AAA
7.1AAA
4.8AA
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

9B9C9D
AEAE91
B0AF58
96945A
303027

Deuteranopia

9792A0
AEAE93
B4BA5B
9FAB58
323426

Tritanopia

80A7A9
AE989A
CE6365
D35251
3B2525

Achromatopsia

A9A9A9
AAAAAA
949494
707070
292929

Shades & Tints Shades & Tints

#7CC491

Dark
Light

#AEAF87

Dark
Light

#D2834A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7cc491;
  --color-2: #aeaf87;
  --color-3: #d2834a;
  --color-4: #db3b64;
  --color-5: #3c2029;
}

SCSS

$color-1: #7cc491;
$color-2: #aeaf87;
$color-3: #d2834a;
$color-4: #db3b64;
$color-5: #3c2029;

TAILWIND

colors: {
  'brand-1': '#7cc491',
  'brand-2': '#aeaf87',
  'brand-3': '#d2834a',
  'brand-4': '#db3b64',
  'brand-5': '#3c2029',
}

RGB Array

[124, 196, 145], [174, 175, 135], [210, 131, 74], [219, 59, 100], [60, 32, 41]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7CC491, #AEAF87, #D2834A, #DB3B64, #3C2029 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: #7cc491; --color-2: #aeaf87; --color-3: #d2834a; --color-4: #db3b64; --color-5: #3c2029. 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