← Back to Editor

#C6D1C2 · #BCC0BB · #B3AFB4 · #A99EAD · #9F8DA6

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryClean

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C6D1C2

Celadon · Silver · Apple Green

HEX
#C6D1C2
RGB
rgb(198, 209, 194)
HSL
hsl(104, 14%, 79%)
HSB
hsb(104, 7%, 82%)
CMYK
cmyk(5%, 0%, 7%, 18%)
Oklch
oklch(84.8% 0.024 137.3)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#BCC0BB

Silver Gray · Silver · Pearl Gray

HEX
#BCC0BB
RGB
rgb(188, 192, 187)
HSL
hsl(108, 4%, 74%)
HSB
hsb(108, 3%, 75%)
CMYK
cmyk(2%, 0%, 3%, 25%)
Oklch
oklch(80.3% 0.008 139.4)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

#B3AFB4

Ash · DarkGray · Silver Sand

HEX
#B3AFB4
RGB
rgb(179, 175, 180)
HSL
hsl(288, 3%, 70%)
HSB
hsb(288, 3%, 71%)
CMYK
cmyk(1%, 3%, 0%, 29%)
Oklch
oklch(75.9% 0.008 319.4)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#A99EAD

Lilac · DarkGray · Silver Sand

HEX
#A99EAD
RGB
rgb(169, 158, 173)
HSL
hsl(284, 8%, 65%)
HSB
hsb(284, 9%, 68%)
CMYK
cmyk(2%, 9%, 0%, 32%)
Oklch
oklch(71.3% 0.025 317.1)

TraditionalLilac」· PaintSilver Sand」· Creative Urban Concrete

#9F8DA6

Dark Plum · DarkGray · Violet

HEX
#9F8DA6
RGB
rgb(159, 141, 166)
HSL
hsl(283, 12%, 60%)
HSB
hsb(283, 15%, 65%)
CMYK
cmyk(4%, 15%, 0%, 35%)
Oklch
oklch(66.8% 0.042 316.6)

TraditionalDark Plum」· PaintViolet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C6D1C2
CDC2D1

Analogous

CDD1C2
C6D1C2
C2D1C5

Triadic

C6D1C2
C2C6D1
D1C2C6

Split-Comp.

C6D1C2
C5C2D1
D1C2CD

Tetradic

C6D1C2
C2CDD1
CDC2D1
D1C5C2

Contrast Matrix WCAG 2.1 Contrast

C6D1C2
BCC0BB
B3AFB4
A99EAD
9F8DA6
1.2
Fail
1.4
Fail
1.6
Fail
1.9
Fail
1.2
Fail
1.2
Fail
1.4
Fail
1.7
Fail
1.4
Fail
1.2
Fail
1.2
Fail
1.4
Fail
1.6
Fail
1.4
Fail
1.2
Fail
1.2
Fail
1.9
Fail
1.7
Fail
1.4
Fail
1.2
Fail
White BG
1.6Fail
1.8Fail
2.2Fail
2.6Fail
3.1AA Large
Black BG
13.3AAA
11.4AAA
9.7AAA
8.2AAA
6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCBC6
BEBEBC
B1B1B3
A4A4A9
9797A0

Deuteranopia

CAC9C6
BEBDBD
B2B2B3
A5A6A9
989A9F

Tritanopia

C7C8C9
BCBDBD
B3B2B2
A8A7A6
9E9B9A

Achromatopsia

CCCCCC
BEBEBE
B1B1B1
A3A3A3
959595

Shades & Tints Shades & Tints

#C6D1C2

Dark
Light

#BCC0BB

Dark
Light

#B3AFB4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c6d1c2;
  --color-2: #bcc0bb;
  --color-3: #b3afb4;
  --color-4: #a99ead;
  --color-5: #9f8da6;
}

SCSS

$color-1: #c6d1c2;
$color-2: #bcc0bb;
$color-3: #b3afb4;
$color-4: #a99ead;
$color-5: #9f8da6;

TAILWIND

colors: {
  'brand-1': '#c6d1c2',
  'brand-2': '#bcc0bb',
  'brand-3': '#b3afb4',
  'brand-4': '#a99ead',
  'brand-5': '#9f8da6',
}

RGB Array

[198, 209, 194], [188, 192, 187], [179, 175, 180], [169, 158, 173], [159, 141, 166]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C6D1C2, #BCC0BB, #B3AFB4, #A99EAD, #9F8DA6 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c6d1c2; --color-2: #bcc0bb; --color-3: #b3afb4; --color-4: #a99ead; --color-5: #9f8da6. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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