← Back to Editor

#B39FE3 · #BDABE0 · #C7B8DD · #D5C8DE · #DBD0D6

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B39FE3

Wisteria · LightSteelBlue · Cobalt Blue

HEX
#B39FE3
RGB
rgb(179, 159, 227)
HSL
hsl(258, 55%, 76%)
HSB
hsb(258, 30%, 89%)
CMYK
cmyk(21%, 30%, 0%, 11%)
Oklch
oklch(74.5% 0.099 297.5)

TraditionalWisteria」· PaintCobalt Blue」· Creative Lavender Dream

#BDABE0

Wisteria · LightSteelBlue · Lilac Purple

HEX
#BDABE0
RGB
rgb(189, 171, 224)
HSL
hsl(260, 46%, 77%)
HSB
hsb(260, 24%, 88%)
CMYK
cmyk(16%, 24%, 0%, 12%)
Oklch
oklch(77.5% 0.077 300.2)

TraditionalWisteria」· PaintLilac Purple」· Creative Lavender Dream

#C7B8DD

Wisteria · LightSteelBlue · Lilac Purple

HEX
#C7B8DD
RGB
rgb(199, 184, 221)
HSL
hsl(264, 35%, 79%)
HSB
hsb(264, 17%, 87%)
CMYK
cmyk(10%, 17%, 0%, 13%)
Oklch
oklch(80.7% 0.054 303.6)

TraditionalWisteria」· PaintLilac Purple」· Creative Lavender Dream

#D5C8DE

Lilac · LightGray · Lavender

HEX
#D5C8DE
RGB
rgb(213, 200, 222)
HSL
hsl(275, 25%, 83%)
HSB
hsb(275, 10%, 87%)
CMYK
cmyk(4%, 10%, 0%, 13%)
Oklch
oklch(85.0% 0.033 311.7)

TraditionalLilac」· PaintLavender」· Creative Lavender Dream

#DBD0D6

Mauve · LightGray · Cherry Blossom

HEX
#DBD0D6
RGB
rgb(219, 208, 214)
HSL
hsl(327, 13%, 84%)
HSB
hsb(327, 5%, 86%)
CMYK
cmyk(0%, 5%, 2%, 14%)
Oklch
oklch(86.8% 0.015 343.3)

TraditionalMauve」· PaintCherry Blossom」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B39FE3
CFE3A0

Analogous

A0AEE3
B39FE3
D6A0E3

Triadic

B39FE3
E3B4A0
A0E3B4

Split-Comp.

B39FE3
E3D6A0
AEE3A0

Tetradic

B39FE3
E3A0AE
CFE3A0
A0E3D6

Contrast Matrix WCAG 2.1 Contrast

B39FE3
BDABE0
C7B8DD
D5C8DE
DBD0D6
1.1
Fail
1.3
Fail
1.5
Fail
1.6
Fail
1.1
Fail
1.1
Fail
1.3
Fail
1.4
Fail
1.3
Fail
1.1
Fail
1.2
Fail
1.2
Fail
1.5
Fail
1.3
Fail
1.2
Fail
1.1
Fail
1.6
Fail
1.4
Fail
1.2
Fail
1.1
Fail
White BG
2.3Fail
2.1Fail
1.9Fail
1.6Fail
1.5Fail
Black BG
9.0AAA
10.1AAA
11.3AAA
13.1AAA
14.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAAAD3
B5B5D3
C1C0D4
CFCFD9
D6D6D5

Deuteranopia

ACADCF
B6B8D0
C1C2D2
D0D1D7
D7D8D4

Tritanopia

B2C6C3
BCC9C7
C6CDCB
D4D4D4
DAD3D3

Achromatopsia

ADADAD
B6B6B6
C1C1C1
CECECE
D4D4D4

Shades & Tints Shades & Tints

#B39FE3

Dark
Light

#BDABE0

Dark
Light

#C7B8DD

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b39fe3;
  --color-2: #bdabe0;
  --color-3: #c7b8dd;
  --color-4: #d5c8de;
  --color-5: #dbd0d6;
}

SCSS

$color-1: #b39fe3;
$color-2: #bdabe0;
$color-3: #c7b8dd;
$color-4: #d5c8de;
$color-5: #dbd0d6;

TAILWIND

colors: {
  'brand-1': '#b39fe3',
  'brand-2': '#bdabe0',
  'brand-3': '#c7b8dd',
  'brand-4': '#d5c8de',
  'brand-5': '#dbd0d6',
}

RGB Array

[179, 159, 227], [189, 171, 224], [199, 184, 221], [213, 200, 222], [219, 208, 214]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B39FE3, #BDABE0, #C7B8DD, #D5C8DE, #DBD0D6 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: #b39fe3; --color-2: #bdabe0; --color-3: #c7b8dd; --color-4: #d5c8de; --color-5: #dbd0d6. 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