#C1BAD1 + #C6C9C3 + #CBD6BA + #CBE6BA + #B0FFB4 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C1BAD1

Wisteria · Silver · Cobalt Blue

HEX

#C1BAD1

RGB

rgb(193, 186, 209)

HSL

hsl(258, 20%, 77%)

HSB

hsb(258, 11%, 82%)

CMYK

cmyk(8%, 11%, 0%, 18%)

Oklch

oklch(80.2% 0.033 299.5)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#C6C9C3

Silver Gray · Silver · Pearl Gray

HEX

#C6C9C3

RGB

rgb(198, 201, 195)

HSL

hsl(90, 5%, 78%)

HSB

hsb(90, 3%, 79%)

CMYK

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

Oklch

oklch(83.2% 0.009 128.6)

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

#CBD6BA

Willow Green · Silver · Apple Green

HEX

#CBD6BA

RGB

rgb(203, 214, 186)

HSL

hsl(84, 25%, 78%)

HSB

hsb(84, 13%, 84%)

CMYK

cmyk(5%, 0%, 13%, 16%)

Oklch

oklch(86.0% 0.040 124.7)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#CBE6BA

Celadon · LightGray · Mint Green

HEX

#CBE6BA

RGB

rgb(203, 230, 186)

HSL

hsl(97, 47%, 82%)

HSB

hsb(97, 19%, 90%)

CMYK

cmyk(12%, 0%, 19%, 10%)

Oklch

oklch(89.4% 0.065 133.4)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#B0FFB4

Emerald · LightGreen · Mint Green

HEX

#B0FFB4

RGB

rgb(176, 255, 180)

HSL

hsl(123, 100%, 85%)

HSB

hsb(123, 31%, 100%)

CMYK

cmyk(31%, 0%, 29%, 0%)

Oklch

oklch(93.0% 0.127 145.7)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C1BAD1

C9D0B9

Analogous

B9BDD0

C1BAD1

CBB9D0

Triadic

C1BAD1

D0C0B9

B9D0C0

Split-Comp.

C1BAD1

D0CBB9

BDD0B9

Tetradic

C1BAD1

D0B9BD

C9D0B9

B9D0CB

Contrast Matrix WCAG 2.1 Contrast

C1BAD1	C6C9C3	CBD6BA	CBE6BA	B0FFB4
—	1.1 Fail	1.2 Fail	1.4 Fail	1.6 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.4 Fail
1.2 Fail	1.1 Fail	—	1.1 Fail	1.3 Fail
1.4 Fail	1.2 Fail	1.1 Fail	—	1.1 Fail
1.6 Fail	1.4 Fail	1.3 Fail	1.1 Fail	—

White BG

1.9Fail

1.7Fail

1.5Fail

1.3Fail

1.2Fail

Black BG

11.2AAA

12.5AAA

13.9AAA

15.6AAA

17.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBECB

C7C7C4

D0D0C1

D7D7C5

D2D3C6

Deuteranopia

BEBFCA

C7C7C5

CFCEC2

D5D3C7

CEC8CB

Tritanopia

C1C7C6

C6C6C6

CCC6C7

CCCDCF

B4D4D8

Achromatopsia

BFBFBF

C7C7C7

D0D0D0

D9D9D9

DFDFDF

Shades & Tints Shades & Tints

#C1BAD1

Dark

Light

#C6C9C3

Dark

Light

#CBD6BA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c1bad1;
  --color-2: #c6c9c3;
  --color-3: #cbd6ba;
  --color-4: #cbe6ba;
  --color-5: #b0ffb4;
}

SCSS

$color-1: #c1bad1;
$color-2: #c6c9c3;
$color-3: #cbd6ba;
$color-4: #cbe6ba;
$color-5: #b0ffb4;

TAILWIND

colors: {
  'brand-1': '#c1bad1',
  'brand-2': '#c6c9c3',
  'brand-3': '#cbd6ba',
  'brand-4': '#cbe6ba',
  'brand-5': '#b0ffb4',
}

RGB Array

[193, 186, 209], [198, 201, 195], [203, 214, 186], [203, 230, 186], [176, 255, 180]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C1BAD1, #C6C9C3, #CBD6BA, #CBE6BA, #B0FFB4 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: #c1bad1; --color-2: #c6c9c3; --color-3: #cbd6ba; --color-4: #cbe6ba; --color-5: #b0ffb4. 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