← Back to Editor

#AB0777 · #EC1E80 · #DD7097 · #8DC3AC · #FFCCB8

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 PostIllustrationData Visualization

Color Details Color Details

#AB0777

Rose Purple · MediumVioletRed · Eggplant

HEX
#AB0777
RGB
rgb(171, 7, 119)
HSL
hsl(319, 92%, 35%)
HSB
hsb(319, 96%, 67%)
CMYK
cmyk(0%, 96%, 30%, 33%)
Oklch
oklch(49.4% 0.205 347.2)

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

#EC1E80

Dark Violet · DeepPink · Rose Pink

HEX
#EC1E80
RGB
rgb(236, 30, 128)
HSL
hsl(331, 84%, 52%)
HSB
hsb(331, 87%, 93%)
CMYK
cmyk(0%, 87%, 46%, 7%)
Oklch
oklch(61.9% 0.238 0.0)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#DD7097

Rouge · LightCoral · Rose Pink

HEX
#DD7097
RGB
rgb(221, 112, 151)
HSL
hsl(339, 62%, 65%)
HSB
hsb(339, 49%, 87%)
CMYK
cmyk(0%, 49%, 32%, 13%)
Oklch
oklch(68.2% 0.142 358.9)

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

#8DC3AC

Jade · DarkSeaGreen · Apple Green

HEX
#8DC3AC
RGB
rgb(141, 195, 172)
HSL
hsl(154, 31%, 66%)
HSB
hsb(154, 28%, 76%)
CMYK
cmyk(28%, 0%, 12%, 24%)
Oklch
oklch(77.3% 0.065 166.5)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#FFCCB8

Apricot · Wheat · Peach Orange

HEX
#FFCCB8
RGB
rgb(255, 204, 184)
HSL
hsl(17, 100%, 86%)
HSB
hsb(17, 28%, 100%)
CMYK
cmyk(0%, 20%, 28%, 0%)
Oklch
oklch(88.5% 0.064 42.5)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AB0777
07AB3B

Analogous

8D07AB
AB0777
AB0725

Triadic

AB0777
77AB07
0777AB

Split-Comp.

AB0777
25AB07
07AB8D

Tetradic

AB0777
AB8D07
07AB3B
0725AB

Contrast Matrix WCAG 2.1 Contrast

AB0777
EC1E80
DD7097
8DC3AC
FFCCB8
—
1.7
Fail
2.3
Fail
3.5
AA Large
4.8
AA
1.7
Fail
—
1.4
Fail
2.1
Fail
2.9
Fail
2.3
Fail
1.4
Fail
—
1.5
Fail
2.1
Fail
3.5
AA Large
2.1
Fail
1.5
Fail
—
1.4
Fail
4.8
AA
2.9
Fail
2.1
Fail
1.4
Fail
—
White BG
6.9AA
4.1AA Large
3.1AA Large
2.0Fail
1.4Fail
Black BG
3.0AA Large
5.1AA
6.8AA
10.5AAA
14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

64635C
939168
AEAD8E
A4A5B2
E9E8BD

Deuteranopia

6E7A55
9FAE63
B4BC8B
A19DB3
ECF0BE

Tritanopia

A34742
E25651
D88684
90B6B7
FCC1C2

Achromatopsia

454545
676767
959595
B0B0B0
D9D9D9

Shades & Tints Shades & Tints

#AB0777

Dark
Light

#EC1E80

Dark
Light

#DD7097

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ab0777;
  --color-2: #ec1e80;
  --color-3: #dd7097;
  --color-4: #8dc3ac;
  --color-5: #ffccb8;
}

SCSS

$color-1: #ab0777;
$color-2: #ec1e80;
$color-3: #dd7097;
$color-4: #8dc3ac;
$color-5: #ffccb8;

TAILWIND

colors: {
  'brand-1': '#ab0777',
  'brand-2': '#ec1e80',
  'brand-3': '#dd7097',
  'brand-4': '#8dc3ac',
  'brand-5': '#ffccb8',
}

RGB Array

[171, 7, 119], [236, 30, 128], [221, 112, 151], [141, 195, 172], [255, 204, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #AB0777, #EC1E80, #DD7097, #8DC3AC, #FFCCB8 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: #ab0777; --color-2: #ec1e80; --color-3: #dd7097; --color-4: #8dc3ac; --color-5: #ffccb8. 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 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