#B885A7 + #FEC2CB + #60DEE5 + #95DFD1 + #D5DCDC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B885A7

Mauve · DarkGray · Rose Pink

HEX

#B885A7

RGB

rgb(184, 133, 167)

HSL

hsl(320, 26%, 62%)

HSB

hsb(320, 28%, 72%)

CMYK

cmyk(0%, 28%, 9%, 28%)

Oklch

oklch(67.7% 0.077 339.4)

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

#FEC2CB

Peach Pink · Pink · Cherry Blossom

HEX

#FEC2CB

RGB

rgb(254, 194, 203)

HSL

hsl(351, 97%, 88%)

HSB

hsb(351, 24%, 100%)

CMYK

cmyk(0%, 24%, 20%, 0%)

Oklch

oklch(87.0% 0.070 8.6)

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

#60DEE5

Sky Blue · MediumTurquoise · Lake Green

HEX

#60DEE5

RGB

rgb(96, 222, 229)

HSL

hsl(183, 72%, 64%)

HSB

hsb(183, 58%, 90%)

CMYK

cmyk(58%, 3%, 0%, 10%)

Oklch

oklch(83.3% 0.111 200.3)

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

#95DFD1

Jade · LightBlue · Lake Green

HEX

#95DFD1

RGB

rgb(149, 223, 209)

HSL

hsl(169, 54%, 73%)

HSB

hsb(169, 33%, 87%)

CMYK

cmyk(33%, 0%, 6%, 13%)

Oklch

oklch(85.1% 0.076 181.2)

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

#D5DCDC

Sky Blue · LightGray · Pearl Gray

HEX

#D5DCDC

RGB

rgb(213, 220, 220)

HSL

hsl(180, 9%, 85%)

HSB

hsb(180, 3%, 86%)

CMYK

cmyk(3%, 0%, 0%, 14%)

Oklch

oklch(88.9% 0.008 197.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B885A7

85B796

Analogous

AF85B7

B885A7

B7858D

Triadic

B885A7

A6B785

85A6B7

Split-Comp.

B885A7

8DB785

85B7AF

Tetradic

B885A7

B7AF85

85B796

858DB7

Contrast Matrix WCAG 2.1 Contrast

B885A7	FEC2CB	60DEE5	95DFD1	D5DCDC
—	2.0 Fail	1.9 Fail	2.0 Fail	2.2 Fail
2.0 Fail	—	1.1 Fail	1.0 Fail	1.1 Fail
1.9 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
2.0 Fail	1.0 Fail	1.1 Fail	—	1.1 Fail
2.2 Fail	1.1 Fail	1.2 Fail	1.1 Fail	—

White BG

3.0AA Large

1.5Fail

1.6Fail

1.5Fail

1.4Fail

Black BG

7.0AA

13.8AAA

13.1AAA

13.8AAA

15.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A19F

E4E3C9

9798E3

B5B6D4

D8D8DC

Deuteranopia

A5A99D

E8ECC8

8F86E3

B1ABD5

D8D7DC

Tritanopia

B59897

FBC7C7

66E2E2

99D7D8

D5DCDC

Achromatopsia

989898

D5D5D5

B9B9B9

C7C7C7

DADADA

Shades & Tints Shades & Tints

#B885A7

Dark

Light

#FEC2CB

Dark

Light

#60DEE5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b885a7;
  --color-2: #fec2cb;
  --color-3: #60dee5;
  --color-4: #95dfd1;
  --color-5: #d5dcdc;
}

SCSS

$color-1: #b885a7;
$color-2: #fec2cb;
$color-3: #60dee5;
$color-4: #95dfd1;
$color-5: #d5dcdc;

TAILWIND

colors: {
  'brand-1': '#b885a7',
  'brand-2': '#fec2cb',
  'brand-3': '#60dee5',
  'brand-4': '#95dfd1',
  'brand-5': '#d5dcdc',
}

RGB Array

[184, 133, 167], [254, 194, 203], [96, 222, 229], [149, 223, 209], [213, 220, 220]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B885A7, #FEC2CB, #60DEE5, #95DFD1, #D5DCDC 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: #b885a7; --color-2: #fec2cb; --color-3: #60dee5; --color-4: #95dfd1; --color-5: #d5dcdc. 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