#A17ABD + #B391BA + #C5A8B6 + #D7BFB3 + #E9D5AF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A17ABD

Lilac · MediumOrchid · Lilac Purple

HEX

#A17ABD

RGB

rgb(161, 122, 189)

HSL

hsl(275, 34%, 61%)

HSB

hsb(275, 35%, 74%)

CMYK

cmyk(15%, 35%, 0%, 26%)

Oklch

oklch(64.2% 0.106 310.3)

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

#B391BA

Lilac · DarkGray · Lilac Purple

HEX

#B391BA

RGB

rgb(179, 145, 186)

HSL

hsl(290, 23%, 65%)

HSB

hsb(290, 22%, 73%)

CMYK

cmyk(4%, 22%, 0%, 27%)

Oklch

oklch(70.1% 0.070 320.5)

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

#C5A8B6

Rouge · Silver · Rose Pink

HEX

#C5A8B6

RGB

rgb(197, 168, 182)

HSL

hsl(331, 20%, 72%)

HSB

hsb(331, 15%, 77%)

CMYK

cmyk(0%, 15%, 8%, 23%)

Oklch

oklch(76.1% 0.039 347.3)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#D7BFB3

Apricot · Silver · Peach Orange

HEX

#D7BFB3

RGB

rgb(215, 191, 179)

HSL

hsl(20, 31%, 77%)

HSB

hsb(20, 17%, 84%)

CMYK

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

Oklch

oklch(82.2% 0.032 48.3)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E9D5AF

Goose Yellow · Wheat · Peach Orange

HEX

#E9D5AF

RGB

rgb(233, 213, 175)

HSL

hsl(39, 57%, 80%)

HSB

hsb(39, 25%, 91%)

CMYK

cmyk(0%, 9%, 25%, 9%)

Oklch

oklch(88.0% 0.055 83.4)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A17ABD

96BD7A

Analogous

7F7ABD

A17ABD

BD7AB8

Triadic

A17ABD

BDA17A

7ABDA1

Split-Comp.

A17ABD

B8BD7A

7ABD7F

Tetradic

A17ABD

BD7F7A

96BD7A

7AB8BD

Contrast Matrix WCAG 2.1 Contrast

A17ABD	B391BA	C5A8B6	D7BFB3	E9D5AF
—	1.3 Fail	1.6 Fail	2.0 Fail	2.4 Fail
1.3 Fail	—	1.3 Fail	1.6 Fail	1.9 Fail
1.6 Fail	1.3 Fail	—	1.2 Fail	1.5 Fail
2.0 Fail	1.6 Fail	1.2 Fail	—	1.2 Fail
2.4 Fail	1.9 Fail	1.5 Fail	1.2 Fail	—

White BG

3.5AA Large

2.7Fail

2.2Fail

1.8Fail

1.4Fail

Black BG

6.0AA

7.7AAA

9.7AAA

12.0AAA

14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9090AD

A4A4B0

B8B8B3

CDCCB6

E0E0B8

Deuteranopia

9295A9

A6A9AE

BABCB2

CED0B7

E2E3BA

Tritanopia

9FA09D

B1A8A7

C4B0AF

D6B8B9

E8BFC1

Achromatopsia

8D8D8D

A0A0A0

B2B2B2

C5C5C5

D7D7D7

Shades & Tints Shades & Tints

#A17ABD

Dark

Light

#B391BA

Dark

Light

#C5A8B6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a17abd;
  --color-2: #b391ba;
  --color-3: #c5a8b6;
  --color-4: #d7bfb3;
  --color-5: #e9d5af;
}

SCSS

$color-1: #a17abd;
$color-2: #b391ba;
$color-3: #c5a8b6;
$color-4: #d7bfb3;
$color-5: #e9d5af;

TAILWIND

colors: {
  'brand-1': '#a17abd',
  'brand-2': '#b391ba',
  'brand-3': '#c5a8b6',
  'brand-4': '#d7bfb3',
  'brand-5': '#e9d5af',
}

RGB Array

[161, 122, 189], [179, 145, 186], [197, 168, 182], [215, 191, 179], [233, 213, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A17ABD, #B391BA, #C5A8B6, #D7BFB3, #E9D5AF 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: #a17abd; --color-2: #b391ba; --color-3: #c5a8b6; --color-4: #d7bfb3; --color-5: #e9d5af. 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