#AD56DB + #B278D7 + #B69AD3 + #BBBCCE + #BFDECA - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#AD56DB

Royal Purple · MediumOrchid · Violet

HEX

#AD56DB

RGB

rgb(173, 86, 219)

HSL

hsl(279, 65%, 60%)

HSB

hsb(279, 61%, 86%)

CMYK

cmyk(21%, 61%, 0%, 14%)

Oklch

oklch(61.6% 0.204 312.1)

Traditional「Royal Purple」· Paint「Violet」· Creative Blush Sunrise

#B278D7

Lilac · MediumOrchid · Lilac Purple

HEX

#B278D7

RGB

rgb(178, 120, 215)

HSL

hsl(277, 54%, 66%)

HSB

hsb(277, 44%, 84%)

CMYK

cmyk(17%, 44%, 0%, 16%)

Oklch

oklch(66.9% 0.148 311.1)

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

#B69AD3

Wisteria · Silver · Lilac Purple

HEX

#B69AD3

RGB

rgb(182, 154, 211)

HSL

hsl(269, 39%, 72%)

HSB

hsb(269, 27%, 83%)

CMYK

cmyk(14%, 27%, 0%, 17%)

Oklch

oklch(73.1% 0.086 306.8)

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

#BBBCCE

Azure · Silver · Cobalt Blue

HEX

#BBBCCE

RGB

rgb(187, 188, 206)

HSL

hsl(237, 16%, 77%)

HSB

hsb(237, 9%, 81%)

CMYK

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

Oklch

oklch(80.0% 0.025 283.3)

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

#BFDECA

Celadon · LightGray · Mint Green

HEX

#BFDECA

RGB

rgb(191, 222, 202)

HSL

hsl(141, 32%, 81%)

HSB

hsb(141, 14%, 87%)

CMYK

cmyk(14%, 0%, 9%, 13%)

Oklch

oklch(87.2% 0.043 157.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AD56DB

85DB57

Analogous

6B57DB

AD56DB

DB57C7

Triadic

AD56DB

DBAD57

57DBAD

Split-Comp.

AD56DB

C7DB57

57DB6B

Tetradic

AD56DB

DB6B57

85DB57

57C7DB

Contrast Matrix WCAG 2.1 Contrast

AD56DB	B278D7	B69AD3	BBBCCE	BFDECA
—	1.3 Fail	1.7 Fail	2.2 Fail	2.8 Fail
1.3 Fail	—	1.3 Fail	1.7 Fail	2.2 Fail
1.7 Fail	1.3 Fail	—	1.3 Fail	1.7 Fail
2.2 Fail	1.7 Fail	1.3 Fail	—	1.3 Fail
2.8 Fail	2.2 Fail	1.7 Fail	1.3 Fail	—

White BG

4.1AA Large

3.2AA Large

2.5Fail

1.9Fail

1.4Fail

Black BG

5.1AA

6.6AA

8.6AAA

11.2AAA

14.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8787BB

9998C0

AAAAC5

BBBBCA

CCCDCF

Deuteranopia

8C93B3

9CA1BB

ACAEC2

BBBBC9

CBC8D0

Tritanopia

A9A19C

AFAEAA

B5BAB8

BBC6C5

C1D3D4

Achromatopsia

7F7F7F

949494

A9A9A9

BEBEBE

D2D2D2

Shades & Tints Shades & Tints

#AD56DB

Dark

Light

#B278D7

Dark

Light

#B69AD3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ad56db;
  --color-2: #b278d7;
  --color-3: #b69ad3;
  --color-4: #bbbcce;
  --color-5: #bfdeca;
}

SCSS

$color-1: #ad56db;
$color-2: #b278d7;
$color-3: #b69ad3;
$color-4: #bbbcce;
$color-5: #bfdeca;

TAILWIND

colors: {
  'brand-1': '#ad56db',
  'brand-2': '#b278d7',
  'brand-3': '#b69ad3',
  'brand-4': '#bbbcce',
  'brand-5': '#bfdeca',
}

RGB Array

[173, 86, 219], [178, 120, 215], [182, 154, 211], [187, 188, 206], [191, 222, 202]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AD56DB, #B278D7, #B69AD3, #BBBCCE, #BFDECA 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: #ad56db; --color-2: #b278d7; --color-3: #b69ad3; --color-4: #bbbcce; --color-5: #bfdeca. 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