← Back to Editor

#FF5EAA · #80D8FF · #ECEBE3 · #F85D7E

bright

A 4-color bright palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#FF5EAA

Rouge · LightCoral · Rose Pink

HEX
#FF5EAA
RGB
rgb(255, 94, 170)
HSL
hsl(332, 100%, 68%)
HSB
hsb(332, 63%, 100%)
CMYK
cmyk(0%, 63%, 33%, 0%)
Oklch
oklch(71.2% 0.207 354.4)

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

#80D8FF

Sky Blue · LightSkyBlue · Lake Green

HEX
#80D8FF
RGB
rgb(128, 216, 255)
HSL
hsl(198, 100%, 75%)
HSB
hsb(198, 50%, 100%)
CMYK
cmyk(50%, 15%, 0%, 0%)
Oklch
oklch(84.1% 0.101 228.4)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#ECEBE3

Fresh Green · Beige · Lemon Cream

HEX
#ECEBE3
RGB
rgb(236, 235, 227)
HSL
hsl(53, 19%, 91%)
HSB
hsb(53, 4%, 93%)
CMYK
cmyk(0%, 0%, 4%, 7%)
Oklch
oklch(93.9% 0.011 100.8)

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

#F85D7E

Peach Pink · LightCoral · Coral Red

HEX
#F85D7E
RGB
rgb(248, 93, 126)
HSL
hsl(347, 92%, 67%)
HSB
hsb(347, 63%, 97%)
CMYK
cmyk(0%, 63%, 49%, 3%)
Oklch
oklch(68.8% 0.190 10.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF5EAA
5CFFB3

Analogous

FF5CFA
FF5EAA
FF615C

Triadic

FF5EAA
A8FF5C
5CA8FF

Split-Comp.

FF5EAA
5CFF61
5CFAFF

Tetradic

FF5EAA
FAFF5C
5CFFB3
615CFF

Contrast Matrix WCAG 2.1 Contrast

FF5EAA
80D8FF
ECEBE3
F85D7E
—
1.8
Fail
2.4
Fail
1.1
Fail
1.8
Fail
—
1.3
Fail
1.9
Fail
2.4
Fail
1.3
Fail
—
2.6
Fail
1.1
Fail
1.9
Fail
2.6
Fail
—
White BG
2.8Fail
1.6Fail
1.2Fail
3.1AA Large
Black BG
7.4AAA
13.2AAA
17.6AAA
6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B898
A6A7F6
ECECE5
B5B376

Deuteranopia

C3CF93
A19AF3
ECECE5
BECA74

Tritanopia

F78986
84EEEC
ECE6E7
F0706E

Achromatopsia

979797
C2C2C2
EAEAEA
8F8F8F

Shades & Tints Shades & Tints

#FF5EAA

Dark
Light

#80D8FF

Dark
Light

#ECEBE3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff5eaa;
  --color-2: #80d8ff;
  --color-3: #ecebe3;
  --color-4: #f85d7e;
}

SCSS

$color-1: #ff5eaa;
$color-2: #80d8ff;
$color-3: #ecebe3;
$color-4: #f85d7e;

TAILWIND

colors: {
  'brand-1': '#ff5eaa',
  'brand-2': '#80d8ff',
  'brand-3': '#ecebe3',
  'brand-4': '#f85d7e',
}

RGB Array

[255, 94, 170], [128, 216, 255], [236, 235, 227], [248, 93, 126]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This bright-style palette of #FF5EAA, #80D8FF, #ECEBE3, #F85D7E is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #ff5eaa; --color-2: #80d8ff; --color-3: #ecebe3; --color-4: #f85d7e. 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. 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 bright-style 4-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