← Back to Editor

#574B70 · #BF4572 · #FF4D73 · #FC8385 · #E3B89F

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 App

Color Details Color Details

#574B70

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX
#574B70
RGB
rgb(87, 75, 112)
HSL
hsl(259, 20%, 37%)
HSB
hsb(259, 33%, 44%)
CMYK
cmyk(22%, 33%, 0%, 56%)
Oklch
oklch(44.0% 0.061 298.8)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#BF4572

Dark Violet · MediumVioletRed · Rose Pink

HEX
#BF4572
RGB
rgb(191, 69, 114)
HSL
hsl(338, 49%, 51%)
HSB
hsb(338, 64%, 75%)
CMYK
cmyk(0%, 64%, 40%, 25%)
Oklch
oklch(57.0% 0.161 0.8)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#FF4D73

Peach Pink · Tomato · Coral Red

HEX
#FF4D73
RGB
rgb(255, 77, 115)
HSL
hsl(347, 100%, 65%)
HSB
hsb(347, 70%, 100%)
CMYK
cmyk(0%, 70%, 55%, 0%)
Oklch
oklch(68.0% 0.213 12.6)

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

#FC8385

Peach Pink · LightCoral · Coral Red

HEX
#FC8385
RGB
rgb(252, 131, 133)
HSL
hsl(359, 95%, 75%)
HSB
hsb(359, 48%, 99%)
CMYK
cmyk(0%, 48%, 47%, 1%)
Oklch
oklch(74.6% 0.148 20.2)

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

#E3B89F

Apricot · BurlyWood · Peach Orange

HEX
#E3B89F
RGB
rgb(227, 184, 159)
HSL
hsl(22, 55%, 76%)
HSB
hsb(22, 30%, 89%)
CMYK
cmyk(0%, 19%, 30%, 11%)
Oklch
oklch(81.4% 0.061 51.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

574B70
65714B

Analogous

4B5271
574B70
6A4B71

Triadic

574B70
71574B
4B7157

Split-Comp.

574B70
716A4B
52714B

Tetradic

574B70
714B52
65714B
4B716A

Contrast Matrix WCAG 2.1 Contrast

574B70
BF4572
FF4D73
FC8385
E3B89F
—
1.6
Fail
2.5
Fail
3.3
AA Large
4.4
AA Large
1.6
Fail
—
1.5
Fail
2.0
Fail
2.7
Fail
2.5
Fail
1.5
Fail
—
1.3
Fail
1.8
Fail
3.3
AA Large
2.0
Fail
1.3
Fail
—
1.3
Fail
4.4
AA Large
2.7
Fail
1.8
Fail
1.3
Fail
—
White BG
7.9AAA
4.9AA
3.2AA Large
2.4Fail
1.8Fail
Black BG
2.6Fail
4.3AA Large
6.6AA
8.7AAA
11.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

525267
8A8967
B2B06A
C8C785
D0D0A5

Deuteranopia

535365
919A65
BCCA68
CFD884
D3D6A7

Tritanopia

56605E
B95F5D
F66361
F68484
E1AAAB

Achromatopsia

535353
6F6F6F
878787
A7A7A7
C2C2C2

Shades & Tints Shades & Tints

#574B70

Dark
Light

#BF4572

Dark
Light

#FF4D73

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #574b70;
  --color-2: #bf4572;
  --color-3: #ff4d73;
  --color-4: #fc8385;
  --color-5: #e3b89f;
}

SCSS

$color-1: #574b70;
$color-2: #bf4572;
$color-3: #ff4d73;
$color-4: #fc8385;
$color-5: #e3b89f;

TAILWIND

colors: {
  'brand-1': '#574b70',
  'brand-2': '#bf4572',
  'brand-3': '#ff4d73',
  'brand-4': '#fc8385',
  'brand-5': '#e3b89f',
}

RGB Array

[87, 75, 112], [191, 69, 114], [255, 77, 115], [252, 131, 133], [227, 184, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #574B70, #BF4572, #FF4D73, #FC8385, #E3B89F 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: #574b70; --color-2: #bf4572; --color-3: #ff4d73; --color-4: #fc8385; --color-5: #e3b89f. 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