← Back to Editor

#F7C87B · #FA646A · #C80981 · #0AC598 · #ABBAA6

pastel

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#F7C87B

Goose Yellow · BurlyWood · Warm Sun

HEX
#F7C87B
RGB
rgb(247, 200, 123)
HSL
hsl(37, 89%, 73%)
HSB
hsb(37, 50%, 97%)
CMYK
cmyk(0%, 19%, 50%, 3%)
Oklch
oklch(85.8% 0.109 78.9)

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

#FA646A

Peach Pink · Salmon · Coral Red

HEX
#FA646A
RGB
rgb(250, 100, 106)
HSL
hsl(358, 94%, 69%)
HSB
hsb(358, 60%, 98%)
CMYK
cmyk(0%, 60%, 58%, 2%)
Oklch
oklch(69.5% 0.184 20.9)

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

#C80981

Rose Purple · MediumVioletRed · Camellia

HEX
#C80981
RGB
rgb(200, 9, 129)
HSL
hsl(322, 91%, 41%)
HSB
hsb(322, 96%, 78%)
CMYK
cmyk(0%, 96%, 36%, 22%)
Oklch
oklch(55.0% 0.225 351.1)

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

#0AC598

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#0AC598
RGB
rgb(10, 197, 152)
HSL
hsl(166, 90%, 41%)
HSB
hsb(166, 95%, 77%)
CMYK
cmyk(95%, 0%, 23%, 23%)
Oklch
oklch(73.2% 0.146 168.7)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#ABBAA6

Celadon · DarkGray · Apple Green

HEX
#ABBAA6
RGB
rgb(171, 186, 166)
HSL
hsl(105, 13%, 69%)
HSB
hsb(105, 11%, 73%)
CMYK
cmyk(8%, 0%, 11%, 27%)
Oklch
oklch(77.2% 0.032 137.8)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7C87B
7DACF7

Analogous

F78B7D
F7C87B
E9F77D

Triadic

F7C87B
7DF7C8
C87DF7

Split-Comp.

F7C87B
7DE9F7
8B7DF7

Tetradic

F7C87B
7DF78B
7DACF7
F77DE9

Contrast Matrix WCAG 2.1 Contrast

F7C87B
FA646A
C80981
0AC598
ABBAA6
—
1.9
Fail
3.5
AA Large
1.4
Fail
1.3
Fail
1.9
Fail
—
1.9
Fail
1.3
Fail
1.5
Fail
3.5
AA Large
1.9
Fail
—
2.5
Fail
2.7
Fail
1.4
Fail
1.3
Fail
2.5
Fail
—
1.1
Fail
1.3
Fail
1.5
Fail
2.7
Fail
1.1
Fail
—
White BG
1.6Fail
3.0Fail
5.5AA
2.2Fail
2.0Fail
Black BG
13.5AAA
7.1AAA
3.8AA Large
9.5AAA
10.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E3E28E
B9B869
757464
5B5DA3
B1B2AB

Deuteranopia

E5E992
C2CD68
808F5D
5042A6
B1B0AC

Tritanopia

F59CA0
F36767
BE4D48
13ABAD
ACAFB0

Achromatopsia

CDCDCD
929292
505050
888888
B3B3B3

Shades & Tints Shades & Tints

#F7C87B

Dark
Light

#FA646A

Dark
Light

#C80981

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7c87b;
  --color-2: #fa646a;
  --color-3: #c80981;
  --color-4: #0ac598;
  --color-5: #abbaa6;
}

SCSS

$color-1: #f7c87b;
$color-2: #fa646a;
$color-3: #c80981;
$color-4: #0ac598;
$color-5: #abbaa6;

TAILWIND

colors: {
  'brand-1': '#f7c87b',
  'brand-2': '#fa646a',
  'brand-3': '#c80981',
  'brand-4': '#0ac598',
  'brand-5': '#abbaa6',
}

RGB Array

[247, 200, 123], [250, 100, 106], [200, 9, 129], [10, 197, 152], [171, 186, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #F7C87B, #FA646A, #C80981, #0AC598, #ABBAA6 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: #f7c87b; --color-2: #fa646a; --color-3: #c80981; --color-4: #0ac598; --color-5: #abbaa6. 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 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