← Back to Editor

#F2BB4B · #F89C6F · #FA6678 · #AE56C7 · #5A4BFA

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

#F2BB4B

Ginger · SandyBrown · Sunflower

HEX
#F2BB4B
RGB
rgb(242, 187, 75)
HSL
hsl(40, 87%, 62%)
HSB
hsb(40, 69%, 95%)
CMYK
cmyk(0%, 23%, 69%, 5%)
Oklch
oklch(82.2% 0.141 82.0)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#F89C6F

Apricot · LightSalmon · Warm Sun

HEX
#F89C6F
RGB
rgb(248, 156, 111)
HSL
hsl(20, 91%, 70%)
HSB
hsb(20, 55%, 97%)
CMYK
cmyk(0%, 37%, 55%, 3%)
Oklch
oklch(77.7% 0.126 46.4)

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

#FA6678

Peach Pink · Salmon · Coral Red

HEX
#FA6678
RGB
rgb(250, 102, 120)
HSL
hsl(353, 94%, 69%)
HSB
hsb(353, 59%, 98%)
CMYK
cmyk(0%, 59%, 52%, 2%)
Oklch
oklch(70.1% 0.181 15.8)

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

#AE56C7

Dark Plum · MediumOrchid · Violet

HEX
#AE56C7
RGB
rgb(174, 86, 199)
HSL
hsl(287, 50%, 56%)
HSB
hsb(287, 57%, 78%)
CMYK
cmyk(13%, 57%, 0%, 22%)
Oklch
oklch(60.5% 0.184 318.3)

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

#5A4BFA

Wisteria · MediumSlateBlue · Cobalt Blue

HEX
#5A4BFA
RGB
rgb(90, 75, 250)
HSL
hsl(245, 95%, 64%)
HSB
hsb(245, 70%, 98%)
CMYK
cmyk(64%, 70%, 0%, 2%)
Oklch
oklch(54.4% 0.248 278.1)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2BB4B
4A82F2

Analogous

F2664A
F2BB4B
D6F24A

Triadic

F2BB4B
4AF2BA
BA4AF2

Split-Comp.

F2BB4B
4AD6F2
664AF2

Tetradic

F2BB4B
4AF266
4A82F2
F24AD6

Contrast Matrix WCAG 2.1 Contrast

F2BB4B
F89C6F
FA6678
AE56C7
5A4BFA
—
1.2
Fail
1.7
Fail
2.4
Fail
3.1
AA Large
1.2
Fail
—
1.4
Fail
2.0
Fail
2.6
Fail
1.7
Fail
1.4
Fail
—
1.5
Fail
1.9
Fail
2.4
Fail
2.0
Fail
1.5
Fail
—
1.3
Fail
3.1
AA Large
2.6
Fail
1.9
Fail
1.3
Fail
—
White BG
1.8Fail
2.1Fail
2.9Fail
4.2AA Large
5.5AA
Black BG
12.0AAA
10.0AAA
7.2AAA
5.0AA
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DADA66
D0CF7A
BAB974
8887AC
5453D0

Deuteranopia

DDE16D
D6DC7C
C3CE73
8D94A5
5456C6

Tritanopia

EF7B80
F38284
F3706F
AA9691
59AEA7

Achromatopsia

BFBFBF
B2B2B2
949494
7D7D7D
636363

Shades & Tints Shades & Tints

#F2BB4B

Dark
Light

#F89C6F

Dark
Light

#FA6678

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2bb4b;
  --color-2: #f89c6f;
  --color-3: #fa6678;
  --color-4: #ae56c7;
  --color-5: #5a4bfa;
}

SCSS

$color-1: #f2bb4b;
$color-2: #f89c6f;
$color-3: #fa6678;
$color-4: #ae56c7;
$color-5: #5a4bfa;

TAILWIND

colors: {
  'brand-1': '#f2bb4b',
  'brand-2': '#f89c6f',
  'brand-3': '#fa6678',
  'brand-4': '#ae56c7',
  'brand-5': '#5a4bfa',
}

RGB Array

[242, 187, 75], [248, 156, 111], [250, 102, 120], [174, 86, 199], [90, 75, 250]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #F2BB4B, #F89C6F, #FA6678, #AE56C7, #5A4BFA 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: #f2bb4b; --color-2: #f89c6f; --color-3: #fa6678; --color-4: #ae56c7; --color-5: #5a4bfa. 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