← Back to Editor

#EC3A83 · #FAFB87 · #FF54A3 · #BD32A3 · #9964CC

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

#EC3A83

Dark Violet · DeepPink · Rose Pink

HEX
#EC3A83
RGB
rgb(236, 58, 131)
HSL
hsl(335, 82%, 58%)
HSB
hsb(335, 75%, 93%)
CMYK
cmyk(0%, 75%, 44%, 7%)
Oklch
oklch(63.7% 0.219 1.1)

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

#FAFB87

Fresh Green · Khaki · Lemon Cream

HEX
#FAFB87
RGB
rgb(250, 251, 135)
HSL
hsl(61, 94%, 76%)
HSB
hsb(61, 46%, 98%)
CMYK
cmyk(0%, 0%, 46%, 2%)
Oklch
oklch(96.4% 0.139 109.2)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#FF54A3

Rouge · LightCoral · Rose Pink

HEX
#FF54A3
RGB
rgb(255, 84, 163)
HSL
hsl(332, 100%, 66%)
HSB
hsb(332, 67%, 100%)
CMYK
cmyk(0%, 67%, 36%, 0%)
Oklch
oklch(70.0% 0.217 355.9)

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

#BD32A3

Rose Purple · MediumVioletRed · Violet

HEX
#BD32A3
RGB
rgb(189, 50, 163)
HSL
hsl(311, 58%, 47%)
HSB
hsb(311, 74%, 74%)
CMYK
cmyk(0%, 74%, 14%, 26%)
Oklch
oklch(56.8% 0.210 336.7)

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

#9964CC

Dark Plum · MediumOrchid · Violet

HEX
#9964CC
RGB
rgb(153, 100, 204)
HSL
hsl(271, 50%, 60%)
HSB
hsb(271, 51%, 80%)
CMYK
cmyk(25%, 51%, 0%, 20%)
Oklch
oklch(60.4% 0.159 305.7)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EC3A83
3CECA3

Analogous

EC3CDD
EC3A83
EC4B3C

Triadic

EC3A83
85EC3C
3C85EC

Split-Comp.

EC3A83
3CEC4B
3CDDEC

Tetradic

EC3A83
DDEC3C
3CECA3
4B3CEC

Contrast Matrix WCAG 2.1 Contrast

EC3A83
FAFB87
FF54A3
BD32A3
9964CC
—
3.5
AA Large
1.3
Fail
1.3
Fail
1.1
Fail
3.5
AA Large
—
2.7
Fail
4.6
AA
3.8
AA Large
1.3
Fail
2.7
Fail
—
1.7
Fail
1.4
Fail
1.3
Fail
4.6
AA
1.7
Fail
—
1.2
Fail
1.1
Fail
3.8
AA Large
1.4
Fail
1.2
Fail
—
White BG
3.8AA Large
1.1Fail
3.0Fail
5.1AA
4.2AA Large
Black BG
5.5AA
19.2AAA
7.0AAA
4.1AA Large
5.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9F9D71
FAFAA3
B5B390
818088
8282B3

Deuteranopia

A9B76D
FAFAAA
BFCC8B
899381
8589AD

Tritanopia

E36360
FAB9BE
F6817D
B6726D
969F9B

Achromatopsia

787878
EDEDED
909090
686868
808080

Shades & Tints Shades & Tints

#EC3A83

Dark
Light

#FAFB87

Dark
Light

#FF54A3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ec3a83;
  --color-2: #fafb87;
  --color-3: #ff54a3;
  --color-4: #bd32a3;
  --color-5: #9964cc;
}

SCSS

$color-1: #ec3a83;
$color-2: #fafb87;
$color-3: #ff54a3;
$color-4: #bd32a3;
$color-5: #9964cc;

TAILWIND

colors: {
  'brand-1': '#ec3a83',
  'brand-2': '#fafb87',
  'brand-3': '#ff54a3',
  'brand-4': '#bd32a3',
  'brand-5': '#9964cc',
}

RGB Array

[236, 58, 131], [250, 251, 135], [255, 84, 163], [189, 50, 163], [153, 100, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #EC3A83, #FAFB87, #FF54A3, #BD32A3, #9964CC 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: #ec3a83; --color-2: #fafb87; --color-3: #ff54a3; --color-4: #bd32a3; --color-5: #9964cc. 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