← Back to Editor

#BFCCCA · #9FC6BE · #C0B1A0 · #DC898D · #FB5C79

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BFCCCA

Jade · Silver · Glacier Blue

HEX
#BFCCCA
RGB
rgb(191, 204, 202)
HSL
hsl(171, 11%, 77%)
HSB
hsb(171, 6%, 80%)
CMYK
cmyk(6%, 0%, 1%, 20%)
Oklch
oklch(83.5% 0.014 185.9)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#9FC6BE

Jade · Silver · Lake Green

HEX
#9FC6BE
RGB
rgb(159, 198, 190)
HSL
hsl(168, 25%, 70%)
HSB
hsb(168, 20%, 78%)
CMYK
cmyk(20%, 0%, 4%, 22%)
Oklch
oklch(79.6% 0.043 181.3)

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

#C0B1A0

Ginger · DarkGray · Warm Sun

HEX
#C0B1A0
RGB
rgb(192, 177, 160)
HSL
hsl(32, 20%, 69%)
HSB
hsb(32, 17%, 75%)
CMYK
cmyk(0%, 8%, 17%, 25%)
Oklch
oklch(76.8% 0.029 70.8)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#DC898D

Peach Pink · LightCoral · Coral Red

HEX
#DC898D
RGB
rgb(220, 137, 141)
HSL
hsl(357, 54%, 70%)
HSB
hsb(357, 38%, 86%)
CMYK
cmyk(0%, 38%, 36%, 14%)
Oklch
oklch(71.7% 0.102 16.8)

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

#FB5C79

Peach Pink · Salmon · Coral Red

HEX
#FB5C79
RGB
rgb(251, 92, 121)
HSL
hsl(349, 95%, 67%)
HSB
hsb(349, 63%, 98%)
CMYK
cmyk(0%, 63%, 52%, 2%)
Oklch
oklch(69.0% 0.194 12.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BFCCCA
CBBEC0

Analogous

BECBC2
BFCCCA
BEC6CB

Triadic

BFCCCA
C9BECB
CBC9BE

Split-Comp.

BFCCCA
CBBEC6
CBC2BE

Tetradic

BFCCCA
C2BECB
CBBEC0
C6CBBE

Contrast Matrix WCAG 2.1 Contrast

BFCCCA
9FC6BE
C0B1A0
DC898D
FB5C79
—
1.1
Fail
1.3
Fail
1.6
Fail
1.8
Fail
1.1
Fail
—
1.1
Fail
1.4
Fail
1.6
Fail
1.3
Fail
1.1
Fail
—
1.3
Fail
1.5
Fail
1.6
Fail
1.4
Fail
1.3
Fail
—
1.2
Fail
1.8
Fail
1.6
Fail
1.5
Fail
1.2
Fail
—
White BG
1.7Fail
1.9Fail
2.1Fail
2.6Fail
3.0AA Large
Black BG
12.7AAA
11.3AAA
10.0AAA
8.0AAA
6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C5C5CA
B0B0C0
BAB9A4
B8B78C
B6B572

Deuteranopia

C4C3CB
AEABC0
BABBA5
BDC38C
BFCB70

Tritanopia

C0CBCB
A1C1C2
BFA7A8
D88B8B
F36C6B

Achromatopsia

C8C8C8
B9B9B9
B4B4B4
A2A2A2
8F8F8F

Shades & Tints Shades & Tints

#BFCCCA

Dark
Light

#9FC6BE

Dark
Light

#C0B1A0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bfccca;
  --color-2: #9fc6be;
  --color-3: #c0b1a0;
  --color-4: #dc898d;
  --color-5: #fb5c79;
}

SCSS

$color-1: #bfccca;
$color-2: #9fc6be;
$color-3: #c0b1a0;
$color-4: #dc898d;
$color-5: #fb5c79;

TAILWIND

colors: {
  'brand-1': '#bfccca',
  'brand-2': '#9fc6be',
  'brand-3': '#c0b1a0',
  'brand-4': '#dc898d',
  'brand-5': '#fb5c79',
}

RGB Array

[191, 204, 202], [159, 198, 190], [192, 177, 160], [220, 137, 141], [251, 92, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BFCCCA, #9FC6BE, #C0B1A0, #DC898D, #FB5C79 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: #bfccca; --color-2: #9fc6be; --color-3: #c0b1a0; --color-4: #dc898d; --color-5: #fb5c79. 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