#BCF1C1 + #BDD2F2 + #BDEDF2 + #C0C7D1 + #D5D0D9 · luxury - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BCF1C1

Emerald · LightGray · Mint Green

HEX

#BCF1C1

RGB

rgb(188, 241, 193)

HSL

hsl(126, 65%, 84%)

HSB

hsb(126, 22%, 95%)

CMYK

cmyk(22%, 0%, 20%, 5%)

Oklch

oklch(90.9% 0.085 147.3)

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

#BDD2F2

Azure · LightBlue · Sky Blue

HEX

#BDD2F2

RGB

rgb(189, 210, 242)

HSL

hsl(216, 67%, 85%)

HSB

hsb(216, 22%, 95%)

CMYK

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

Oklch

oklch(85.8% 0.050 258.7)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

#BDEDF2

Sky Blue · LightBlue · Glacier Blue

HEX

#BDEDF2

RGB

rgb(189, 237, 242)

HSL

hsl(186, 67%, 85%)

HSB

hsb(186, 22%, 95%)

CMYK

cmyk(22%, 2%, 0%, 5%)

Oklch

oklch(91.4% 0.050 204.2)

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

#C0C7D1

Azure · Silver · Cobalt Blue

HEX

#C0C7D1

RGB

rgb(192, 199, 209)

HSL

hsl(215, 16%, 79%)

HSB

hsb(215, 8%, 82%)

CMYK

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

Oklch

oklch(82.7% 0.016 257.2)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#D5D0D9

Lilac · LightGray · Lavender

HEX

#D5D0D9

RGB

rgb(213, 208, 217)

HSL

hsl(273, 11%, 83%)

HSB

hsb(273, 4%, 85%)

CMYK

cmyk(2%, 4%, 0%, 15%)

Oklch

oklch(86.4% 0.013 310.5)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BCF1C1

F1BCEB

Analogous

D1F1BC

BCF1C1

BCF1DC

Triadic

BCF1C1

C1BCF1

F1C1BC

Split-Comp.

BCF1C1

DCBCF1

F1BCD1

Tetradic

BCF1C1

BCD1F1

F1BCEB

F1DCBC

Contrast Matrix WCAG 2.1 Contrast

BCF1C1	BDD2F2	BDEDF2	C0C7D1	D5D0D9
—	1.2 Fail	1.0 Fail	1.3 Fail	1.2 Fail
1.2 Fail	—	1.2 Fail	1.1 Fail	1.0 Fail
1.0 Fail	1.2 Fail	—	1.3 Fail	1.2 Fail
1.3 Fail	1.1 Fail	1.3 Fail	—	1.1 Fail
1.2 Fail	1.0 Fail	1.2 Fail	1.1 Fail	—

White BG

1.3Fail

1.5Fail

1.3Fail

1.7Fail

1.5Fail

Black BG

16.5AAA

13.7AAA

16.6AAA

12.3AAA

13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D3CD

C6C6EA

D2D2F1

C3C3CF

D3D3D7

Deuteranopia

D0CCCF

C5C3E8

CFCBF0

C3C2CE

D3D4D6

Tritanopia

BFD6D8

BEE4E3

BFF0F0

C0CDCC

D5D5D5

Achromatopsia

DCDCDC

CFCFCF

DFDFDF

C6C6C6

D3D3D3

Shades & Tints Shades & Tints

#BCF1C1

Dark

Light

#BDD2F2

Dark

Light

#BDEDF2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bcf1c1;
  --color-2: #bdd2f2;
  --color-3: #bdedf2;
  --color-4: #c0c7d1;
  --color-5: #d5d0d9;
}

SCSS

$color-1: #bcf1c1;
$color-2: #bdd2f2;
$color-3: #bdedf2;
$color-4: #c0c7d1;
$color-5: #d5d0d9;

TAILWIND

colors: {
  'brand-1': '#bcf1c1',
  'brand-2': '#bdd2f2',
  'brand-3': '#bdedf2',
  'brand-4': '#c0c7d1',
  'brand-5': '#d5d0d9',
}

RGB Array

[188, 241, 193], [189, 210, 242], [189, 237, 242], [192, 199, 209], [213, 208, 217]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This luxury-style palette of #BCF1C1, #BDD2F2, #BDEDF2, #C0C7D1, #D5D0D9 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: #bcf1c1; --color-2: #bdd2f2; --color-3: #bdedf2; --color-4: #c0c7d1; --color-5: #d5d0d9. 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 luxury-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