← Back to Editor

#7E548A · #F88996 · #FFBBB8 · #FAE2A8 · #BFB9C0

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#7E548A

Dark Plum · DimGray · Violet

HEX
#7E548A
RGB
rgb(126, 84, 138)
HSL
hsl(287, 24%, 44%)
HSB
hsb(287, 39%, 54%)
CMYK
cmyk(9%, 39%, 0%, 46%)
Oklch
oklch(51.3% 0.096 318.5)

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

#F88996

Peach Pink · LightCoral · Coral Red

HEX
#F88996
RGB
rgb(248, 137, 150)
HSL
hsl(353, 89%, 75%)
HSB
hsb(353, 45%, 97%)
CMYK
cmyk(0%, 45%, 40%, 3%)
Oklch
oklch(75.4% 0.135 13.4)

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

#FFBBB8

Peach Pink · LightPink · Cherry Blossom

HEX
#FFBBB8
RGB
rgb(255, 187, 184)
HSL
hsl(3, 100%, 86%)
HSB
hsb(3, 28%, 100%)
CMYK
cmyk(0%, 27%, 28%, 0%)
Oklch
oklch(85.4% 0.079 21.7)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#FAE2A8

Goose Yellow · Wheat · Lemon Cream

HEX
#FAE2A8
RGB
rgb(250, 226, 168)
HSL
hsl(42, 89%, 82%)
HSB
hsb(42, 33%, 98%)
CMYK
cmyk(0%, 10%, 33%, 2%)
Oklch
oklch(91.9% 0.079 88.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#BFB9C0

Silver Gray · Silver · Pearl Gray

HEX
#BFB9C0
RGB
rgb(191, 185, 192)
HSL
hsl(291, 5%, 74%)
HSB
hsb(291, 4%, 75%)
CMYK
cmyk(1%, 4%, 0%, 25%)
Oklch
oklch(79.3% 0.012 321.3)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7E548A
618B55

Analogous

65558B
7E548A
8B557C

Triadic

7E548A
8B7F55
558B7F

Split-Comp.

7E548A
7C8B55
558B65

Tetradic

7E548A
8B6555
618B55
557C8B

Contrast Matrix WCAG 2.1 Contrast

7E548A
F88996
FFBBB8
FAE2A8
BFB9C0
—
2.6
Fail
3.7
AA Large
4.7
AA
3.1
AA Large
2.6
Fail
—
1.4
Fail
1.8
Fail
1.2
Fail
3.7
AA Large
1.4
Fail
—
1.3
Fail
1.2
Fail
4.7
AA
1.8
Fail
1.3
Fail
—
1.5
Fail
3.1
AA Large
1.2
Fail
1.2
Fail
1.5
Fail
—
White BG
6.0AA
2.3Fail
1.6Fail
1.3Fail
1.9Fail
Black BG
3.5AA Large
9.0AAA
13.1AAA
16.5AAA
10.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6C6B7D
C8C793
E2E1B9
F0EFB6
BCBCBE

Deuteranopia

6E717A
CED792
E6EBB9
F1F3B9
BDBDBE

Tritanopia

7C7370
F29090
FCB9B9
F9C1C4
BFBDBD

Achromatopsia

676767
ACACAC
CFCFCF
E3E3E3
BCBCBC

Shades & Tints Shades & Tints

#7E548A

Dark
Light

#F88996

Dark
Light

#FFBBB8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7e548a;
  --color-2: #f88996;
  --color-3: #ffbbb8;
  --color-4: #fae2a8;
  --color-5: #bfb9c0;
}

SCSS

$color-1: #7e548a;
$color-2: #f88996;
$color-3: #ffbbb8;
$color-4: #fae2a8;
$color-5: #bfb9c0;

TAILWIND

colors: {
  'brand-1': '#7e548a',
  'brand-2': '#f88996',
  'brand-3': '#ffbbb8',
  'brand-4': '#fae2a8',
  'brand-5': '#bfb9c0',
}

RGB Array

[126, 84, 138], [248, 137, 150], [255, 187, 184], [250, 226, 168], [191, 185, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7E548A, #F88996, #FFBBB8, #FAE2A8, #BFB9C0 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs, 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: #7e548a; --color-2: #f88996; --color-3: #ffbbb8; --color-4: #fae2a8; --color-5: #bfb9c0. 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. 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 general-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