← Back to Editor

#FFA87D · #F76868 · #B93452 · #871E6F · #400C61

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

#FFA87D

Apricot · LightSalmon · Warm Sun

HEX
#FFA87D
RGB
rgb(255, 168, 125)
HSL
hsl(20, 100%, 75%)
HSB
hsb(20, 51%, 100%)
CMYK
cmyk(0%, 34%, 51%, 0%)
Oklch
oklch(80.8% 0.118 46.9)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#F76868

Peach Pink · Salmon · Coral Red

HEX
#F76868
RGB
rgb(247, 104, 104)
HSL
hsl(0, 90%, 69%)
HSB
hsb(0, 58%, 97%)
CMYK
cmyk(0%, 58%, 58%, 3%)
Oklch
oklch(69.6% 0.176 22.8)

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

#B93452

Crimson · Brown · Passion Red

HEX
#B93452
RGB
rgb(185, 52, 82)
HSL
hsl(346, 56%, 46%)
HSB
hsb(346, 72%, 73%)
CMYK
cmyk(0%, 72%, 56%, 27%)
Oklch
oklch(53.3% 0.169 12.0)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#871E6F

Rose Purple · Purple · Eggplant

HEX
#871E6F
RGB
rgb(135, 30, 111)
HSL
hsl(314, 64%, 32%)
HSB
hsb(314, 78%, 53%)
CMYK
cmyk(0%, 78%, 18%, 47%)
Oklch
oklch(43.8% 0.164 339.1)

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

#400C61

Royal Purple · MidnightBlue · Eggplant

HEX
#400C61
RGB
rgb(64, 12, 97)
HSL
hsl(277, 78%, 21%)
HSB
hsb(277, 88%, 38%)
CMYK
cmyk(34%, 88%, 0%, 62%)
Oklch
oklch(29.9% 0.137 307.2)

Traditional「Royal Purple」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFA87D
80D4FF

Analogous

FF8095
FFA87D
FFEA80

Triadic

FFA87D
80FFAA
AA80FF

Split-Comp.

FFA87D
80FFEA
8095FF

Tetradic

FFA87D
95FF80
80D4FF
EA80FF

Contrast Matrix WCAG 2.1 Contrast

FFA87D
F76868
B93452
871E6F
400C61
—
1.6
Fail
3.0
AA Large
4.6
AA
7.7
AAA
1.6
Fail
—
1.9
Fail
2.9
Fail
4.9
AA
3.0
AA Large
1.9
Fail
—
1.5
Fail
2.5
Fail
4.6
AA
2.9
Fail
1.5
Fail
—
1.7
Fail
7.7
AAA
4.9
AA
2.5
Fail
1.7
Fail
—
White BG
1.9Fail
2.9Fail
5.7AA
8.6AAA
14.6AAA
Black BG
11.1AAA
7.1AAA
3.7AA Large
2.4Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D9D987
B9B868
7F7E4B
5A595B
29294C

Deuteranopia

DEE58A
C1CC68
879149
606857
2D3047

Tritanopia

FB9091
F06868
B24544
824C49
3D3C39

Achromatopsia

BDBDBD
939393
5F5F5F
474747
252525

Shades & Tints Shades & Tints

#FFA87D

Dark
Light

#F76868

Dark
Light

#B93452

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffa87d;
  --color-2: #f76868;
  --color-3: #b93452;
  --color-4: #871e6f;
  --color-5: #400c61;
}

SCSS

$color-1: #ffa87d;
$color-2: #f76868;
$color-3: #b93452;
$color-4: #871e6f;
$color-5: #400c61;

TAILWIND

colors: {
  'brand-1': '#ffa87d',
  'brand-2': '#f76868',
  'brand-3': '#b93452',
  'brand-4': '#871e6f',
  'brand-5': '#400c61',
}

RGB Array

[255, 168, 125], [247, 104, 104], [185, 52, 82], [135, 30, 111], [64, 12, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFA87D, #F76868, #B93452, #871E6F, #400C61 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: #ffa87d; --color-2: #f76868; --color-3: #b93452; --color-4: #871e6f; --color-5: #400c61. 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