← Back to Editor

#3F3451 · #C52356 · #52A20D · #90D20D · #E5FD66

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#3F3451

Deep Indigo · DarkSlateGray · Eggplant

HEX
#3F3451
RGB
rgb(63, 52, 81)
HSL
hsl(263, 22%, 26%)
HSB
hsb(263, 36%, 32%)
CMYK
cmyk(22%, 36%, 0%, 68%)
Oklch
oklch(35.0% 0.051 301.2)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

#C52356

Dark Violet · Crimson · Camellia

HEX
#C52356
RGB
rgb(197, 35, 86)
HSL
hsl(341, 70%, 45%)
HSB
hsb(341, 82%, 77%)
CMYK
cmyk(0%, 82%, 56%, 23%)
Oklch
oklch(54.1% 0.196 9.4)

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

#52A20D

Pine Green · ForestGreen · Forest Green

HEX
#52A20D
RGB
rgb(82, 162, 13)
HSL
hsl(92, 85%, 34%)
HSB
hsb(92, 92%, 64%)
CMYK
cmyk(49%, 0%, 92%, 36%)
Oklch
oklch(63.6% 0.184 135.7)

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

#90D20D

Grass Green · Chartreuse · Olive Green

HEX
#90D20D
RGB
rgb(144, 210, 13)
HSL
hsl(80, 88%, 44%)
HSB
hsb(80, 94%, 82%)
CMYK
cmyk(31%, 0%, 94%, 18%)
Oklch
oklch(78.9% 0.207 129.0)

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

#E5FD66

Willow Green · Khaki · Apple Green

HEX
#E5FD66
RGB
rgb(229, 253, 102)
HSL
hsl(70, 97%, 70%)
HSB
hsb(70, 60%, 99%)
CMYK
cmyk(9%, 0%, 60%, 1%)
Oklch
oklch(94.8% 0.175 117.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3F3451
465134

Analogous

343751
3F3451
4D3451

Triadic

3F3451
513F34
34513F

Split-Comp.

3F3451
514D34
375134

Tetradic

3F3451
513437
465134
34514D

Contrast Matrix WCAG 2.1 Contrast

3F3451
C52356
52A20D
90D20D
E5FD66
—
2.1
Fail
3.6
AA Large
6.3
AA
10.2
AAA
2.1
Fail
—
1.7
Fail
3.0
AA Large
5.0
AA
3.6
AA Large
1.7
Fail
—
1.7
Fail
2.8
Fail
6.3
AA
3.0
AA Large
1.7
Fail
—
1.6
Fail
10.2
AAA
5.0
AA
2.8
Fail
1.6
Fail
—
White BG
11.5AAA
5.6AA
3.2AA Large
1.8Fail
1.1Fail
Black BG
1.8Fail
3.7AA Large
6.5AA
11.4AAA
18.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3A3A4A
7F7D4A
757531
ADAD3D
EFF08B

Deuteranopia

3B3C48
889447
706A3A
A9A448
EEEC93

Tritanopia

3E4443
BD403E
564E54
93626B
E6A7AE

Achromatopsia

3B3B3B
595959
797979
A8A8A8
E5E5E5

Shades & Tints Shades & Tints

#3F3451

Dark
Light

#C52356

Dark
Light

#52A20D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3f3451;
  --color-2: #c52356;
  --color-3: #52a20d;
  --color-4: #90d20d;
  --color-5: #e5fd66;
}

SCSS

$color-1: #3f3451;
$color-2: #c52356;
$color-3: #52a20d;
$color-4: #90d20d;
$color-5: #e5fd66;

TAILWIND

colors: {
  'brand-1': '#3f3451',
  'brand-2': '#c52356',
  'brand-3': '#52a20d',
  'brand-4': '#90d20d',
  'brand-5': '#e5fd66',
}

RGB Array

[63, 52, 81], [197, 35, 86], [82, 162, 13], [144, 210, 13], [229, 253, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3F3451, #C52356, #52A20D, #90D20D, #E5FD66 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: #3f3451; --color-2: #c52356; --color-3: #52a20d; --color-4: #90d20d; --color-5: #e5fd66. 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