← Back to Editor

#83E881 · #C2CD33 · #CCA92A · #CC8719 · #DE1F20

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#83E881

Emerald · LightGreen · Apple Green

HEX
#83E881
RGB
rgb(131, 232, 129)
HSL
hsl(119, 69%, 71%)
HSB
hsb(119, 44%, 91%)
CMYK
cmyk(44%, 0%, 44%, 9%)
Oklch
oklch(84.5% 0.169 143.5)

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

#C2CD33

Autumn Sage · GoldenRod · Honey Gold

HEX
#C2CD33
RGB
rgb(194, 205, 51)
HSL
hsl(64, 61%, 50%)
HSB
hsb(64, 75%, 80%)
CMYK
cmyk(5%, 0%, 75%, 20%)
Oklch
oklch(81.4% 0.167 113.7)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#CCA92A

Ochre · GoldenRod · Honey Gold

HEX
#CCA92A
RGB
rgb(204, 169, 42)
HSL
hsl(47, 66%, 48%)
HSB
hsb(47, 79%, 80%)
CMYK
cmyk(0%, 17%, 79%, 20%)
Oklch
oklch(74.5% 0.141 92.4)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#CC8719

Ochre · DarkGoldenRod · Amber Brown

HEX
#CC8719
RGB
rgb(204, 135, 25)
HSL
hsl(37, 78%, 45%)
HSB
hsb(37, 88%, 80%)
CMYK
cmyk(0%, 34%, 88%, 20%)
Oklch
oklch(67.8% 0.139 71.5)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#DE1F20

Vermilion · Crimson · Passion Red

HEX
#DE1F20
RGB
rgb(222, 31, 32)
HSL
hsl(360, 75%, 50%)
HSB
hsb(360, 86%, 87%)
CMYK
cmyk(0%, 86%, 86%, 13%)
Oklch
oklch(57.6% 0.221 27.7)

Traditional「Vermilion」· Paint「Passion Red」· Creative Deep Ember

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

83E881
E682E8

Analogous

B7E882
83E881
82E8B3

Triadic

83E881
8284E8
E88284

Split-Comp.

83E881
B382E8
E882B7

Tetradic

83E881
82B7E8
E682E8
E8B382

Contrast Matrix WCAG 2.1 Contrast

83E881
C2CD33
CCA92A
CC8719
DE1F20
—
1.1
Fail
1.5
Fail
2.0
Fail
3.2
AA Large
1.1
Fail
—
1.3
Fail
1.7
Fail
2.8
Fail
1.5
Fail
1.3
Fail
—
1.3
Fail
2.1
Fail
2.0
Fail
1.7
Fail
1.3
Fail
—
1.6
Fail
3.2
AA Large
2.8
Fail
2.1
Fail
1.6
Fail
—
White BG
1.5Fail
1.7Fail
2.3Fail
3.0Fail
4.9AA
Black BG
13.8AAA
12.1AAA
9.3AAA
7.0AAA
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

AFB09A
C7C758
BDBD49
AEAE34
8B8A20

Deuteranopia

A9A1A0
C6C561
BFC150
B2B73A
96A520

Tritanopia

88AEB2
C3767C
CA6166
C9494D
D42020

Achromatopsia

BEBEBE
B8B8B8
A5A5A5
8F8F8F
585858

Shades & Tints Shades & Tints

#83E881

Dark
Light

#C2CD33

Dark
Light

#CCA92A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #83e881;
  --color-2: #c2cd33;
  --color-3: #cca92a;
  --color-4: #cc8719;
  --color-5: #de1f20;
}

SCSS

$color-1: #83e881;
$color-2: #c2cd33;
$color-3: #cca92a;
$color-4: #cc8719;
$color-5: #de1f20;

TAILWIND

colors: {
  'brand-1': '#83e881',
  'brand-2': '#c2cd33',
  'brand-3': '#cca92a',
  'brand-4': '#cc8719',
  'brand-5': '#de1f20',
}

RGB Array

[131, 232, 129], [194, 205, 51], [204, 169, 42], [204, 135, 25], [222, 31, 32]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #83E881, #C2CD33, #CCA92A, #CC8719, #DE1F20 is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #83e881; --color-2: #c2cd33; --color-3: #cca92a; --color-4: #cc8719; --color-5: #de1f20. 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 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