← Back to Editor

#2BD493 · #F7E7B4 · #E88687 · #C5316B · #4B2860

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

#2BD493

Mineral Blue · LightSeaGreen · Olive Green

HEX
#2BD493
RGB
rgb(43, 212, 147)
HSL
hsl(157, 66%, 50%)
HSB
hsb(157, 80%, 83%)
CMYK
cmyk(80%, 0%, 31%, 17%)
Oklch
oklch(77.3% 0.162 161.2)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#F7E7B4

Goose Yellow · Wheat · Lemon Cream

HEX
#F7E7B4
RGB
rgb(247, 231, 180)
HSL
hsl(46, 81%, 84%)
HSB
hsb(46, 27%, 97%)
CMYK
cmyk(0%, 6%, 27%, 3%)
Oklch
oklch(92.8% 0.068 92.7)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#E88687

Peach Pink · LightCoral · Coral Red

HEX
#E88687
RGB
rgb(232, 134, 135)
HSL
hsl(359, 68%, 72%)
HSB
hsb(359, 42%, 91%)
CMYK
cmyk(0%, 42%, 42%, 9%)
Oklch
oklch(72.5% 0.120 19.8)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#C5316B

Dark Violet · MediumVioletRed · Camellia

HEX
#C5316B
RGB
rgb(197, 49, 107)
HSL
hsl(336, 60%, 48%)
HSB
hsb(336, 75%, 77%)
CMYK
cmyk(0%, 75%, 46%, 23%)
Oklch
oklch(55.7% 0.188 2.0)

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

#4B2860

Dark Plum · DarkSlateBlue · Eggplant

HEX
#4B2860
RGB
rgb(75, 40, 96)
HSL
hsl(278, 41%, 27%)
HSB
hsb(278, 58%, 38%)
CMYK
cmyk(22%, 58%, 0%, 62%)
Oklch
oklch(35.0% 0.100 311.1)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2BD493
D42B6C

Analogous

2BD43F
2BD493
2BC0D4

Triadic

2BD493
932BD4
D4932B

Split-Comp.

2BD493
D42BC0
D43F2B

Tetradic

2BD493
3F2BD4
D42B6C
C0D42B

Contrast Matrix WCAG 2.1 Contrast

2BD493
F7E7B4
E88687
C5316B
4B2860
—
1.6
Fail
1.3
Fail
2.7
Fail
6.2
AA
1.6
Fail
—
2.1
Fail
4.2
AA Large
9.6
AAA
1.3
Fail
2.1
Fail
—
2.0
Fail
4.6
AA
2.7
Fail
4.2
AA Large
2.0
Fail
—
2.3
Fail
6.2
AA
9.6
AAA
4.6
AA
2.3
Fail
—
White BG
1.9Fail
1.2Fail
2.6Fail
5.2AA
11.9AAA
Black BG
10.9AAA
17.0AAA
8.2AAA
4.0AA Large
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

7476A3
F0F0C0
BEBD87
85845D
3C3C52

Deuteranopia

6A5EA7
F1F2C3
C3CB87
8E995A
3E414F

Tritanopia

33AFB2
F6CACC
E38787
BE524F
494845

Achromatopsia

9A9A9A
E6E6E6
A3A3A3
646464
393939

Shades & Tints Shades & Tints

#2BD493

Dark
Light

#F7E7B4

Dark
Light

#E88687

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2bd493;
  --color-2: #f7e7b4;
  --color-3: #e88687;
  --color-4: #c5316b;
  --color-5: #4b2860;
}

SCSS

$color-1: #2bd493;
$color-2: #f7e7b4;
$color-3: #e88687;
$color-4: #c5316b;
$color-5: #4b2860;

TAILWIND

colors: {
  'brand-1': '#2bd493',
  'brand-2': '#f7e7b4',
  'brand-3': '#e88687',
  'brand-4': '#c5316b',
  'brand-5': '#4b2860',
}

RGB Array

[43, 212, 147], [247, 231, 180], [232, 134, 135], [197, 49, 107], [75, 40, 96]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2BD493, #F7E7B4, #E88687, #C5316B, #4B2860 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: #2bd493; --color-2: #f7e7b4; --color-3: #e88687; --color-4: #c5316b; --color-5: #4b2860. 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