#FE86B6 + #FCB5C7 + #EDE7CF + #B4CEC5 + #7BA99E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FE86B6

Rouge · LightPink · Cherry Blossom

HEX

#FE86B6

RGB

rgb(254, 134, 182)

HSL

hsl(336, 98%, 76%)

HSB

hsb(336, 47%, 100%)

CMYK

cmyk(0%, 47%, 28%, 0%)

Oklch

oklch(76.6% 0.154 356.0)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#FCB5C7

Peach Pink · LightPink · Cherry Blossom

HEX

#FCB5C7

RGB

rgb(252, 181, 199)

HSL

hsl(345, 92%, 85%)

HSB

hsb(345, 28%, 99%)

CMYK

cmyk(0%, 28%, 21%, 1%)

Oklch

oklch(84.4% 0.085 2.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#EDE7CF

Goose Yellow · Beige · Lemon Cream

HEX

#EDE7CF

RGB

rgb(237, 231, 207)

HSL

hsl(48, 45%, 87%)

HSB

hsb(48, 13%, 93%)

CMYK

cmyk(0%, 3%, 13%, 7%)

Oklch

oklch(92.6% 0.032 95.4)

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

#B4CEC5

Jade · Silver · Apple Green

HEX

#B4CEC5

RGB

rgb(180, 206, 197)

HSL

hsl(159, 21%, 76%)

HSB

hsb(159, 13%, 81%)

CMYK

cmyk(13%, 0%, 4%, 19%)

Oklch

oklch(82.9% 0.031 172.7)

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

#7BA99E

Mineral Blue · CadetBlue · Lake Green

HEX

#7BA99E

RGB

rgb(123, 169, 158)

HSL

hsl(166, 21%, 57%)

HSB

hsb(166, 27%, 66%)

CMYK

cmyk(27%, 0%, 7%, 34%)

Oklch

oklch(69.9% 0.052 178.3)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FE86B6

86FECE

Analogous

FE86F2

FE86B6

FE9286

Triadic

FE86B6

B6FE86

86B6FE

Split-Comp.

FE86B6

86FE92

86F2FE

Tetradic

FE86B6

F2FE86

86FECE

9286FE

Contrast Matrix WCAG 2.1 Contrast

FE86B6	FCB5C7	EDE7CF	B4CEC5	7BA99E
—	1.4 Fail	1.8 Fail	1.4 Fail	1.2 Fail
1.4 Fail	—	1.3 Fail	1.0 Fail	1.6 Fail
1.8 Fail	1.3 Fail	—	1.3 Fail	2.1 Fail
1.4 Fail	1.0 Fail	1.3 Fail	—	1.6 Fail
1.2 Fail	1.6 Fail	2.1 Fail	1.6 Fail	—

White BG

2.3Fail

1.7Fail

1.2Fail

1.7Fail

2.6Fail

Black BG

9.3AAA

12.6AAA

16.9AAA

12.6AAA

8.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CAC9AA

DDDDC3

EAEAD5

BFBFC7

8F8FA1

Deuteranopia

D1DAA8

E1E7C2

EBEBD6

BEBCC8

8C89A1

Tritanopia

F8A19F

F8BFBE

EDD9DA

B5C9C9

7DA3A3

Achromatopsia

AFAFAF

CCCCCC

E6E6E6

C5C5C5

9A9A9A

Shades & Tints Shades & Tints

#FE86B6

Dark

Light

#FCB5C7

Dark

Light

#EDE7CF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fe86b6;
  --color-2: #fcb5c7;
  --color-3: #ede7cf;
  --color-4: #b4cec5;
  --color-5: #7ba99e;
}

SCSS

$color-1: #fe86b6;
$color-2: #fcb5c7;
$color-3: #ede7cf;
$color-4: #b4cec5;
$color-5: #7ba99e;

TAILWIND

colors: {
  'brand-1': '#fe86b6',
  'brand-2': '#fcb5c7',
  'brand-3': '#ede7cf',
  'brand-4': '#b4cec5',
  'brand-5': '#7ba99e',
}

RGB Array

[254, 134, 182], [252, 181, 199], [237, 231, 207], [180, 206, 197], [123, 169, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FE86B6, #FCB5C7, #EDE7CF, #B4CEC5, #7BA99E is ideal for: health products, baby brands, fresh-style blogs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #fe86b6; --color-2: #fcb5c7; --color-3: #ede7cf; --color-4: #b4cec5; --color-5: #7ba99e. 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 general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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