← Back to Editor

#4F4174 · #A53A70 · #D1746C · #FF9683 · #F6E39F

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

#4F4174

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX
#4F4174
RGB
rgb(79, 65, 116)
HSL
hsl(256, 28%, 35%)
HSB
hsb(256, 44%, 45%)
CMYK
cmyk(32%, 44%, 0%, 55%)
Oklch
oklch(41.4% 0.084 295.1)

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

#A53A70

Dark Violet · MediumVioletRed · Camellia

HEX
#A53A70
RGB
rgb(165, 58, 112)
HSL
hsl(330, 48%, 44%)
HSB
hsb(330, 65%, 65%)
CMYK
cmyk(0%, 65%, 32%, 35%)
Oklch
oklch(51.6% 0.151 352.5)

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

#D1746C

Peach Pink · LightCoral · Coral Red

HEX
#D1746C
RGB
rgb(209, 116, 108)
HSL
hsl(5, 52%, 62%)
HSB
hsb(5, 48%, 82%)
CMYK
cmyk(0%, 44%, 48%, 18%)
Oklch
oklch(66.1% 0.118 25.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FF9683

Peach Pink · LightSalmon · Coral Red

HEX
#FF9683
RGB
rgb(255, 150, 131)
HSL
hsl(9, 100%, 76%)
HSB
hsb(9, 49%, 100%)
CMYK
cmyk(0%, 41%, 49%, 0%)
Oklch
oklch(77.9% 0.130 31.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F6E39F

Goose Yellow · Khaki · Lemon Cream

HEX
#F6E39F
RGB
rgb(246, 227, 159)
HSL
hsl(47, 83%, 79%)
HSB
hsb(47, 35%, 96%)
CMYK
cmyk(0%, 8%, 35%, 4%)
Oklch
oklch(91.6% 0.089 94.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4F4174
657240

Analogous

404C72
4F4174
674072

Triadic

4F4174
724E40
40724E

Split-Comp.

4F4174
726740
4C7240

Tetradic

4F4174
72404C
657240
407267

Contrast Matrix WCAG 2.1 Contrast

4F4174
A53A70
D1746C
FF9683
F6E39F
—
1.5
Fail
2.7
Fail
4.2
AA Large
7.0
AAA
1.5
Fail
—
1.9
Fail
2.9
Fail
4.8
AA
2.7
Fail
1.9
Fail
—
1.5
Fail
2.6
Fail
4.2
AA Large
2.9
Fail
1.5
Fail
—
1.7
Fail
7.0
AAA
4.8
AA
2.6
Fail
1.7
Fail
—
White BG
9.0AAA
6.1AA
3.3AA Large
2.1Fail
1.3Fail
Black BG
2.3Fail
3.4AA Large
6.4AA
9.9AAA
16.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

494968
777663
A9A86E
D2D188
EEEEAF

Deuteranopia

4A4B65
7D8560
AEB56E
D8E089
EFF0B3

Tritanopia

4E5E5C
A05956
CC6F70
FA8B8C
F5BCBF

Achromatopsia

4B4B4B
606060
8F8F8F
B3B3B3
E1E1E1

Shades & Tints Shades & Tints

#4F4174

Dark
Light

#A53A70

Dark
Light

#D1746C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4f4174;
  --color-2: #a53a70;
  --color-3: #d1746c;
  --color-4: #ff9683;
  --color-5: #f6e39f;
}

SCSS

$color-1: #4f4174;
$color-2: #a53a70;
$color-3: #d1746c;
$color-4: #ff9683;
$color-5: #f6e39f;

TAILWIND

colors: {
  'brand-1': '#4f4174',
  'brand-2': '#a53a70',
  'brand-3': '#d1746c',
  'brand-4': '#ff9683',
  'brand-5': '#f6e39f',
}

RGB Array

[79, 65, 116], [165, 58, 112], [209, 116, 108], [255, 150, 131], [246, 227, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4F4174, #A53A70, #D1746C, #FF9683, #F6E39F 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: #4f4174; --color-2: #a53a70; --color-3: #d1746c; --color-4: #ff9683; --color-5: #f6e39f. 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