← Back to Editor

#E4E6DA · #F3C1B6 · #FF8899 · #B71E4F · #4F022C

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 AppData Visualization

Color Details Color Details

#E4E6DA

Willow Green · Beige · Mint Green

HEX
#E4E6DA
RGB
rgb(228, 230, 218)
HSL
hsl(70, 19%, 88%)
HSB
hsb(70, 5%, 90%)
CMYK
cmyk(1%, 0%, 5%, 10%)
Oklch
oklch(92.0% 0.016 114.4)

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

#F3C1B6

Peach Pink · LightPink · Cherry Blossom

HEX
#F3C1B6
RGB
rgb(243, 193, 182)
HSL
hsl(11, 72%, 83%)
HSB
hsb(11, 25%, 95%)
CMYK
cmyk(0%, 21%, 25%, 5%)
Oklch
oklch(85.2% 0.060 32.6)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#FF8899

Peach Pink · LightCoral · Coral Red

HEX
#FF8899
RGB
rgb(255, 136, 153)
HSL
hsl(351, 100%, 77%)
HSB
hsb(351, 47%, 100%)
CMYK
cmyk(0%, 47%, 40%, 0%)
Oklch
oklch(76.2% 0.145 12.1)

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

#B71E4F

Dark Violet · Crimson · Camellia

HEX
#B71E4F
RGB
rgb(183, 30, 79)
HSL
hsl(341, 72%, 42%)
HSB
hsb(341, 84%, 72%)
CMYK
cmyk(0%, 84%, 57%, 28%)
Oklch
oklch(51.1% 0.187 9.3)

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

#4F022C

Rose Purple · Maroon · Raspberry

HEX
#4F022C
RGB
rgb(79, 2, 44)
HSL
hsl(327, 95%, 16%)
HSB
hsb(327, 97%, 31%)
CMYK
cmyk(0%, 97%, 44%, 69%)
Oklch
oklch(28.1% 0.113 354.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E4E6DA
DDDBE6

Analogous

E6E2DB
E4E6DA
DEE6DB

Triadic

E4E6DA
DBE4E6
E6DBE4

Split-Comp.

E4E6DA
DBDEE6
E2DBE6

Tetradic

E4E6DA
DBE6E2
DDDBE6
E6DBDE

Contrast Matrix WCAG 2.1 Contrast

E4E6DA
F3C1B6
FF8899
B71E4F
4F022C
—
1.3
Fail
1.8
Fail
5.0
AA
12.1
AAA
1.3
Fail
—
1.4
Fail
4.0
AA Large
9.5
AAA
1.8
Fail
1.4
Fail
—
2.8
Fail
6.7
AA
5.0
AA
4.0
AA Large
2.8
Fail
—
2.4
Fail
12.1
AAA
9.5
AAA
6.7
AA
2.4
Fail
—
White BG
1.3Fail
1.6Fail
2.3Fail
6.3AA
15.2AAA
Black BG
16.6AAA
13.1AAA
9.2AAA
3.3AA Large
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E5E5DD
DDDDB9
CBCA95
757343
2E2D22

Deuteranopia

E5E5DE
E0E4B9
D2DB94
7E8940
32381F

Tritanopia

E4DFE0
F1BBBB
F99291
AF3A38
4B1A18

Achromatopsia

E4E4E4
CFCFCF
AEAEAE
515151
1E1E1E

Shades & Tints Shades & Tints

#E4E6DA

Dark
Light

#F3C1B6

Dark
Light

#FF8899

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e4e6da;
  --color-2: #f3c1b6;
  --color-3: #ff8899;
  --color-4: #b71e4f;
  --color-5: #4f022c;
}

SCSS

$color-1: #e4e6da;
$color-2: #f3c1b6;
$color-3: #ff8899;
$color-4: #b71e4f;
$color-5: #4f022c;

TAILWIND

colors: {
  'brand-1': '#e4e6da',
  'brand-2': '#f3c1b6',
  'brand-3': '#ff8899',
  'brand-4': '#b71e4f',
  'brand-5': '#4f022c',
}

RGB Array

[228, 230, 218], [243, 193, 182], [255, 136, 153], [183, 30, 79], [79, 2, 44]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E4E6DA, #F3C1B6, #FF8899, #B71E4F, #4F022C 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: #e4e6da; --color-2: #f3c1b6; --color-3: #ff8899; --color-4: #b71e4f; --color-5: #4f022c. 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