← Back to Editor

#BAAEEC · #CFD9B9 · #AFDDB2 · #A0D0BB · #91AEA8

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BAAEEC

Wisteria · LightSteelBlue · Cobalt Blue

HEX
#BAAEEC
RGB
rgb(186, 174, 236)
HSL
hsl(252, 62%, 80%)
HSB
hsb(252, 26%, 93%)
CMYK
cmyk(21%, 26%, 0%, 7%)
Oklch
oklch(78.3% 0.088 293.1)

TraditionalWisteria」· PaintCobalt Blue」· Creative Lavender Dream

#CFD9B9

Willow Green · LightGray · Apple Green

HEX
#CFD9B9
RGB
rgb(207, 217, 185)
HSL
hsl(79, 30%, 79%)
HSB
hsb(79, 15%, 85%)
CMYK
cmyk(5%, 0%, 15%, 15%)
Oklch
oklch(86.9% 0.044 121.4)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#AFDDB2

Celadon · Silver · Apple Green

HEX
#AFDDB2
RGB
rgb(175, 221, 178)
HSL
hsl(124, 40%, 78%)
HSB
hsb(124, 21%, 87%)
CMYK
cmyk(21%, 0%, 19%, 13%)
Oklch
oklch(85.4% 0.076 146.6)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#A0D0BB

Jade · Silver · Apple Green

HEX
#A0D0BB
RGB
rgb(160, 208, 187)
HSL
hsl(154, 34%, 72%)
HSB
hsb(154, 23%, 82%)
CMYK
cmyk(23%, 0%, 10%, 18%)
Oklch
oklch(81.8% 0.058 166.3)

TraditionalJade」· PaintApple Green」· Creative Arctic Pool

#91AEA8

Jade · DarkGray · Lake Green

HEX
#91AEA8
RGB
rgb(145, 174, 168)
HSL
hsl(168, 15%, 63%)
HSB
hsb(168, 17%, 68%)
CMYK
cmyk(17%, 0%, 3%, 32%)
Oklch
oklch(72.7% 0.033 181.4)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BAAEEC
DFECAC

Analogous

ACBFEC
BAAEEC
D9ACEC

Triadic

BAAEEC
ECB9AC
ACECB9

Split-Comp.

BAAEEC
ECD9AC
BFECAC

Tetradic

BAAEEC
ECACBF
DFECAC
ACECD9

Contrast Matrix WCAG 2.1 Contrast

BAAEEC
CFD9B9
AFDDB2
A0D0BB
91AEA8
1.4
Fail
1.3
Fail
1.2
Fail
1.2
Fail
1.4
Fail
1.0
Fail
1.2
Fail
1.6
Fail
1.3
Fail
1.0
Fail
1.1
Fail
1.6
Fail
1.2
Fail
1.2
Fail
1.1
Fail
1.4
Fail
1.2
Fail
1.6
Fail
1.6
Fail
1.4
Fail
White BG
2.0Fail
1.5Fail
1.5Fail
1.7Fail
2.4Fail
Black BG
10.4AAA
14.3AAA
13.8AAA
12.2AAA
8.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B5DD
D3D3C1
C3C3BC
B5B5C0
9E9EA9

Deuteranopia

B6B6D9
D3D2C3
C0BDBF
B2AEC1
9C9AAA

Tritanopia

B9D1CF
CFC7C8
B1C5C6
A2C4C5
92ABAB

Achromatopsia

B9B9B9
D2D2D2
CACACA
BFBFBF
A5A5A5

Shades & Tints Shades & Tints

#BAAEEC

Dark
Light

#CFD9B9

Dark
Light

#AFDDB2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #baaeec;
  --color-2: #cfd9b9;
  --color-3: #afddb2;
  --color-4: #a0d0bb;
  --color-5: #91aea8;
}

SCSS

$color-1: #baaeec;
$color-2: #cfd9b9;
$color-3: #afddb2;
$color-4: #a0d0bb;
$color-5: #91aea8;

TAILWIND

colors: {
  'brand-1': '#baaeec',
  'brand-2': '#cfd9b9',
  'brand-3': '#afddb2',
  'brand-4': '#a0d0bb',
  'brand-5': '#91aea8',
}

RGB Array

[186, 174, 236], [207, 217, 185], [175, 221, 178], [160, 208, 187], [145, 174, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BAAEEC, #CFD9B9, #AFDDB2, #A0D0BB, #91AEA8 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: #baaeec; --color-2: #cfd9b9; --color-3: #afddb2; --color-4: #a0d0bb; --color-5: #91aea8. 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