← Back to Editor

#FF577E · #FF897E · #FFA47E · #FFC97E · #FFE17E

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 App

Color Details Color Details

#FF577E

Peach Pink · Salmon · Coral Red

HEX
#FF577E
RGB
rgb(255, 87, 126)
HSL
hsl(346, 100%, 67%)
HSB
hsb(346, 66%, 100%)
CMYK
cmyk(0%, 66%, 51%, 0%)
Oklch
oklch(69.2% 0.204 10.4)

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

#FF897E

Peach Pink · Salmon · Coral Red

HEX
#FF897E
RGB
rgb(255, 137, 126)
HSL
hsl(5, 100%, 75%)
HSB
hsb(5, 51%, 100%)
CMYK
cmyk(0%, 46%, 51%, 0%)
Oklch
oklch(75.7% 0.145 26.6)

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

#FFA47E

Apricot · LightSalmon · Warm Sun

HEX
#FFA47E
RGB
rgb(255, 164, 126)
HSL
hsl(18, 100%, 75%)
HSB
hsb(18, 51%, 100%)
CMYK
cmyk(0%, 36%, 51%, 0%)
Oklch
oklch(80.1% 0.120 43.3)

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

#FFC97E

Goose Yellow · Khaki · Warm Sun

HEX
#FFC97E
RGB
rgb(255, 201, 126)
HSL
hsl(35, 100%, 75%)
HSB
hsb(35, 51%, 100%)
CMYK
cmyk(0%, 21%, 51%, 0%)
Oklch
oklch(86.8% 0.111 74.5)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#FFE17E

Goose Yellow · Khaki · Sunflower

HEX
#FFE17E
RGB
rgb(255, 225, 126)
HSL
hsl(46, 100%, 75%)
HSB
hsb(46, 51%, 100%)
CMYK
cmyk(0%, 12%, 51%, 0%)
Oklch
oklch(91.4% 0.123 92.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF577E
57FFD8

Analogous

FF57D2
FF577E
FF8457

Triadic

FF577E
7EFF57
577EFF

Split-Comp.

FF577E
57FF84
57D2FF

Tetradic

FF577E
D2FF57
57FFD8
8457FF

Contrast Matrix WCAG 2.1 Contrast

FF577E
FF897E
FFA47E
FFC97E
FFE17E
—
1.3
Fail
1.6
Fail
2.0
Fail
2.4
Fail
1.3
Fail
—
1.2
Fail
1.5
Fail
1.8
Fail
1.6
Fail
1.2
Fail
—
1.3
Fail
1.5
Fail
2.0
Fail
1.5
Fail
1.3
Fail
—
1.2
Fail
2.4
Fail
1.8
Fail
1.5
Fail
1.2
Fail
—
White BG
3.0AA Large
2.3Fail
1.9Fail
1.5Fail
1.3Fail
Black BG
6.9AA
9.1AAA
10.9AAA
13.9AAA
16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B575
CCCB81
D8D787
E8E790
F2F296

Deuteranopia

C0CD72
D3DC81
DDE489
EBEF95
F4F69C

Tritanopia

F76D6B
F98383
FA8E90
FC9EA2
FEA9AD

Achromatopsia

8E8E8E
ABABAB
BBBBBB
D1D1D1
DFDFDF

Shades & Tints Shades & Tints

#FF577E

Dark
Light

#FF897E

Dark
Light

#FFA47E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff577e;
  --color-2: #ff897e;
  --color-3: #ffa47e;
  --color-4: #ffc97e;
  --color-5: #ffe17e;
}

SCSS

$color-1: #ff577e;
$color-2: #ff897e;
$color-3: #ffa47e;
$color-4: #ffc97e;
$color-5: #ffe17e;

TAILWIND

colors: {
  'brand-1': '#ff577e',
  'brand-2': '#ff897e',
  'brand-3': '#ffa47e',
  'brand-4': '#ffc97e',
  'brand-5': '#ffe17e',
}

RGB Array

[255, 87, 126], [255, 137, 126], [255, 164, 126], [255, 201, 126], [255, 225, 126]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF577E, #FF897E, #FFA47E, #FFC97E, #FFE17E is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. 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: #ff577e; --color-2: #ff897e; --color-3: #ffa47e; --color-4: #ffc97e; --color-5: #ffe17e. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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