← Back to Editor

#BBFFE4 · #FC7D5A · #A84B78 · #058DC9 · #EBDCB5

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#BBFFE4

Jade · LightBlue · Mint Green

HEX
#BBFFE4
RGB
rgb(187, 255, 228)
HSL
hsl(156, 100%, 87%)
HSB
hsb(156, 27%, 100%)
CMYK
cmyk(27%, 0%, 11%, 0%)
Oklch
oklch(94.7% 0.077 168.2)

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

#FC7D5A

Peach Pink · Coral · Coral Red

HEX
#FC7D5A
RGB
rgb(252, 125, 90)
HSL
hsl(13, 96%, 67%)
HSB
hsb(13, 64%, 99%)
CMYK
cmyk(0%, 50%, 64%, 1%)
Oklch
oklch(72.9% 0.163 36.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#A84B78

Dark Violet · MediumVioletRed · Camellia

HEX
#A84B78
RGB
rgb(168, 75, 120)
HSL
hsl(331, 38%, 48%)
HSB
hsb(331, 55%, 66%)
CMYK
cmyk(0%, 55%, 29%, 34%)
Oklch
oklch(54.5% 0.132 352.1)

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

#058DC9

Lake Blue · LightSeaGreen · Mint Ice

HEX
#058DC9
RGB
rgb(5, 141, 201)
HSL
hsl(198, 95%, 40%)
HSB
hsb(198, 98%, 79%)
CMYK
cmyk(98%, 30%, 0%, 21%)
Oklch
oklch(61.0% 0.133 237.6)

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

#EBDCB5

Goose Yellow · Wheat · Lemon Cream

HEX
#EBDCB5
RGB
rgb(235, 220, 181)
HSL
hsl(43, 57%, 82%)
HSB
hsb(43, 23%, 92%)
CMYK
cmyk(0%, 6%, 23%, 8%)
Oklch
oklch(89.7% 0.054 89.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BBFFE4
FFBDD7

Analogous

BDFFC3
BBFFE4
BDF8FF

Triadic

BBFFE4
E4BDFF
FFE4BD

Split-Comp.

BBFFE4
FFBDF8
FFC3BD

Tetradic

BBFFE4
C3BDFF
FFBDD7
F8FFBD

Contrast Matrix WCAG 2.1 Contrast

BBFFE4
FC7D5A
A84B78
058DC9
EBDCB5
—
2.3
Fail
4.7
AA
3.3
AA Large
1.2
Fail
2.3
Fail
—
2.1
Fail
1.5
Fail
1.9
Fail
4.7
AA
2.1
Fail
—
1.4
Fail
3.9
AA Large
3.3
AA Large
1.5
Fail
1.4
Fail
—
2.7
Fail
1.2
Fail
1.9
Fail
3.9
AA Large
2.7
Fail
—
White BG
1.1Fail
2.6Fail
5.3AA
3.7AA Large
1.4Fail
Black BG
18.5AAA
8.2AAA
3.9AA Large
5.7AA
15.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D8D9EB
C5C462
807F6D
4041BA
E5E4BE

Deuteranopia

D5CFEC
CCD665
858C6B
382EB7
E5E7C1

Tritanopia

BEF0F1
F6696B
A36563
0CAFAD
EAC6C8

Achromatopsia

E8E8E8
9F9F9F
6C6C6C
6B6B6B
DCDCDC

Shades & Tints Shades & Tints

#BBFFE4

Dark
Light

#FC7D5A

Dark
Light

#A84B78

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bbffe4;
  --color-2: #fc7d5a;
  --color-3: #a84b78;
  --color-4: #058dc9;
  --color-5: #ebdcb5;
}

SCSS

$color-1: #bbffe4;
$color-2: #fc7d5a;
$color-3: #a84b78;
$color-4: #058dc9;
$color-5: #ebdcb5;

TAILWIND

colors: {
  'brand-1': '#bbffe4',
  'brand-2': '#fc7d5a',
  'brand-3': '#a84b78',
  'brand-4': '#058dc9',
  'brand-5': '#ebdcb5',
}

RGB Array

[187, 255, 228], [252, 125, 90], [168, 75, 120], [5, 141, 201], [235, 220, 181]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BBFFE4, #FC7D5A, #A84B78, #058DC9, #EBDCB5 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: #bbffe4; --color-2: #fc7d5a; --color-3: #a84b78; --color-4: #058dc9; --color-5: #ebdcb5. 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 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