#BBA1CE + #A1ADCE + #A7CEA1 + #CEC2A1 + #CEA1A1 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BBA1CE

Lilac · Silver · Lilac Purple

HEX

#BBA1CE

RGB

rgb(187, 161, 206)

HSL

hsl(275, 31%, 72%)

HSB

hsb(275, 22%, 81%)

CMYK

cmyk(9%, 22%, 0%, 19%)

Oklch

oklch(74.7% 0.070 310.7)

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

#A1ADCE

Azure · LightSteelBlue · Cobalt Blue

HEX

#A1ADCE

RGB

rgb(161, 173, 206)

HSL

hsl(224, 31%, 72%)

HSB

hsb(224, 22%, 81%)

CMYK

cmyk(22%, 16%, 0%, 19%)

Oklch

oklch(74.9% 0.049 269.5)

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

#A7CEA1

Celadon · DarkSeaGreen · Apple Green

HEX

#A7CEA1

RGB

rgb(167, 206, 161)

HSL

hsl(112, 31%, 72%)

HSB

hsb(112, 22%, 81%)

CMYK

cmyk(19%, 0%, 22%, 19%)

Oklch

oklch(81.1% 0.075 141.3)

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

#CEC2A1

Goose Yellow · Tan · Sunflower

HEX

#CEC2A1

RGB

rgb(206, 194, 161)

HSL

hsl(44, 31%, 72%)

HSB

hsb(44, 22%, 81%)

CMYK

cmyk(0%, 6%, 22%, 19%)

Oklch

oklch(81.5% 0.046 90.4)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#CEA1A1

Peach Pink · Tan · Coral Red

HEX

#CEA1A1

RGB

rgb(206, 161, 161)

HSL

hsl(0, 31%, 72%)

HSB

hsb(0, 22%, 81%)

CMYK

cmyk(0%, 22%, 22%, 19%)

Oklch

oklch(75.0% 0.054 18.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BBA1CE

B4CEA1

Analogous

A5A1CE

BBA1CE

CEA1CA

Triadic

BBA1CE

CEBBA1

A1CEBB

Split-Comp.

BBA1CE

CACEA1

A1CEA5

Tetradic

BBA1CE

CEA5A1

B4CEA1

A1CACE

Contrast Matrix WCAG 2.1 Contrast

BBA1CE	A1ADCE	A7CEA1	CEC2A1	CEA1A1
—	1.0 Fail	1.3 Fail	1.3 Fail	1.0 Fail
1.0 Fail	—	1.3 Fail	1.3 Fail	1.0 Fail
1.3 Fail	1.3 Fail	—	1.0 Fail	1.3 Fail
1.3 Fail	1.3 Fail	1.0 Fail	—	1.3 Fail
1.0 Fail	1.0 Fail	1.3 Fail	1.3 Fail	—

White BG

2.3Fail

2.2Fail

1.8Fail

2.3Fail

Black BG

9.1AAA

9.4AAA

12.0AAA

11.9AAA

9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B0B0C3

A6A6C6

B8B8AC

C9C9A9

BBBAA1

Deuteranopia

B1B3C1

A6A5C4

B6B3AF

CACAAB

BDC1A1

Tritanopia

BABBB9

A2C0BE

A9B4B6

CDAFB1

CCA1A1

Achromatopsia

AEAEAE

ADADAD

BDBDBD

C2C2C2

AEAEAE

Shades & Tints Shades & Tints

#BBA1CE

Dark

Light

#A1ADCE

Dark

Light

#A7CEA1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bba1ce;
  --color-2: #a1adce;
  --color-3: #a7cea1;
  --color-4: #cec2a1;
  --color-5: #cea1a1;
}

SCSS

$color-1: #bba1ce;
$color-2: #a1adce;
$color-3: #a7cea1;
$color-4: #cec2a1;
$color-5: #cea1a1;

TAILWIND

colors: {
  'brand-1': '#bba1ce',
  'brand-2': '#a1adce',
  'brand-3': '#a7cea1',
  'brand-4': '#cec2a1',
  'brand-5': '#cea1a1',
}

RGB Array

[187, 161, 206], [161, 173, 206], [167, 206, 161], [206, 194, 161], [206, 161, 161]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BBA1CE, #A1ADCE, #A7CEA1, #CEC2A1, #CEA1A1 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: #bba1ce; --color-2: #a1adce; --color-3: #a7cea1; --color-4: #cec2a1; --color-5: #cea1a1. 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