← Back to Editor

#F6AF81 · #F39687 · #F17E8D · #E577A4 · #D971BA

pastel

A 5-color pastel palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#F6AF81

Apricot · LightSalmon · Warm Sun

HEX
#F6AF81
RGB
rgb(246, 175, 129)
HSL
hsl(24, 87%, 74%)
HSB
hsb(24, 48%, 96%)
CMYK
cmyk(0%, 29%, 48%, 4%)
Oklch
oklch(81.1% 0.103 53.7)

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

#F39687

Peach Pink · DarkSalmon · Coral Red

HEX
#F39687
RGB
rgb(243, 150, 135)
HSL
hsl(8, 82%, 74%)
HSB
hsb(8, 44%, 95%)
CMYK
cmyk(0%, 38%, 44%, 5%)
Oklch
oklch(76.5% 0.115 29.8)

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

#F17E8D

Peach Pink · LightCoral · Coral Red

HEX
#F17E8D
RGB
rgb(241, 126, 141)
HSL
hsl(352, 80%, 72%)
HSB
hsb(352, 48%, 95%)
CMYK
cmyk(0%, 48%, 41%, 5%)
Oklch
oklch(72.6% 0.141 13.0)

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

#E577A4

Rouge · LightCoral · Rose Pink

HEX
#E577A4
RGB
rgb(229, 119, 164)
HSL
hsl(335, 68%, 68%)
HSB
hsb(335, 48%, 90%)
CMYK
cmyk(0%, 48%, 28%, 10%)
Oklch
oklch(70.7% 0.144 355.6)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#D971BA

Mauve · Orchid · Lilac Purple

HEX
#D971BA
RGB
rgb(217, 113, 186)
HSL
hsl(318, 58%, 65%)
HSB
hsb(318, 48%, 85%)
CMYK
cmyk(0%, 48%, 14%, 15%)
Oklch
oklch(69.0% 0.156 339.7)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6AF81
83C8F6

Analogous

F6838F
F6AF81
F6EB83

Triadic

F6AF81
83F6B1
B183F6

Split-Comp.

F6AF81
83F6EB
838FF6

Tetradic

F6AF81
8FF683
83C8F6
EB83F6

Contrast Matrix WCAG 2.1 Contrast

F6AF81
F39687
F17E8D
E577A4
D971BA
—
1.2
Fail
1.4
Fail
1.5
Fail
1.6
Fail
1.2
Fail
—
1.2
Fail
1.3
Fail
1.4
Fail
1.4
Fail
1.2
Fail
—
1.1
Fail
1.2
Fail
1.5
Fail
1.3
Fail
1.1
Fail
—
1.1
Fail
1.6
Fail
1.4
Fail
1.2
Fail
1.1
Fail
—
White BG
1.8Fail
2.2Fail
2.6Fail
2.8Fail
3.0Fail
Black BG
11.4AAA
9.5AAA
8.1AAA
7.5AAA
7.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D7D78C
CBCA8B
BFBE89
B5B499
ACABA8

Deuteranopia

DBE18F
D0D78C
C6CF89
BCC497
B2BAA4

Tritanopia

F29597
EE8D8E
EB8786
DF918F
D49A97

Achromatopsia

BFBFBF
B0B0B0
A2A2A2
9D9D9D
989898

Shades & Tints Shades & Tints

#F6AF81

Dark
Light

#F39687

Dark
Light

#F17E8D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6af81;
  --color-2: #f39687;
  --color-3: #f17e8d;
  --color-4: #e577a4;
  --color-5: #d971ba;
}

SCSS

$color-1: #f6af81;
$color-2: #f39687;
$color-3: #f17e8d;
$color-4: #e577a4;
$color-5: #d971ba;

TAILWIND

colors: {
  'brand-1': '#f6af81',
  'brand-2': '#f39687',
  'brand-3': '#f17e8d',
  'brand-4': '#e577a4',
  'brand-5': '#d971ba',
}

RGB Array

[246, 175, 129], [243, 150, 135], [241, 126, 141], [229, 119, 164], [217, 113, 186]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #F6AF81, #F39687, #F17E8D, #E577A4, #D971BA 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: #f6af81; --color-2: #f39687; --color-3: #f17e8d; --color-4: #e577a4; --color-5: #d971ba. 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 pastel-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