#A389FF + #A29CB8 + #8C9DBA + #779BD9 + #5C98FF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A389FF

Wisteria · MediumSlateBlue · Cobalt Blue

HEX

#A389FF

RGB

rgb(163, 137, 255)

HSL

hsl(253, 100%, 77%)

HSB

hsb(253, 46%, 100%)

CMYK

cmyk(36%, 46%, 0%, 0%)

Oklch

oklch(70.5% 0.168 291.6)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#A29CB8

Wisteria · DarkGray · Cobalt Blue

HEX

#A29CB8

RGB

rgb(162, 156, 184)

HSL

hsl(253, 16%, 67%)

HSB

hsb(253, 15%, 72%)

CMYK

cmyk(12%, 15%, 0%, 28%)

Oklch

oklch(70.7% 0.041 295.2)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#8C9DBA

Azure · DarkGray · Cobalt Blue

HEX

#8C9DBA

RGB

rgb(140, 157, 186)

HSL

hsl(218, 25%, 64%)

HSB

hsb(218, 25%, 73%)

CMYK

cmyk(25%, 16%, 0%, 27%)

Oklch

oklch(69.3% 0.047 261.1)

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

#779BD9

Azure · CornflowerBlue · Cobalt Blue

HEX

#779BD9

RGB

rgb(119, 155, 217)

HSL

hsl(218, 56%, 66%)

HSB

hsb(218, 45%, 85%)

CMYK

cmyk(45%, 29%, 0%, 15%)

Oklch

oklch(68.8% 0.100 260.9)

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

#5C98FF

Azure · CornflowerBlue · Cobalt Blue

HEX

#5C98FF

RGB

rgb(92, 152, 255)

HSL

hsl(218, 100%, 68%)

HSB

hsb(218, 64%, 100%)

CMYK

cmyk(64%, 40%, 0%, 0%)

Oklch

oklch(68.7% 0.165 260.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A389FF

E6FF8A

Analogous

8AABFF

A389FF

DE8AFF

Triadic

A389FF

FFA38A

8AFFA3

Split-Comp.

A389FF

FFDE8A

ABFF8A

Tetradic

A389FF

FF8AAB

E6FF8A

8AFFDE

Contrast Matrix WCAG 2.1 Contrast

A389FF	A29CB8	8C9DBA	779BD9	5C98FF
—	1.1 Fail	1.0 Fail	1.0 Fail	1.0 Fail
1.1 Fail	—	1.0 Fail	1.1 Fail	1.1 Fail
1.0 Fail	1.0 Fail	—	1.0 Fail	1.0 Fail
1.0 Fail	1.1 Fail	1.0 Fail	—	1.0 Fail
1.0 Fail	1.1 Fail	1.0 Fail	1.0 Fail	—

White BG

2.8Fail

2.6Fail

2.7Fail

2.8Fail

Black BG

7.6AAA

8.0AAA

7.6AAA

7.5AAA

7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9898E2

9F9FB1

9394B3

8787CA

7677E6

Deuteranopia

999BDC

A0A0B0

9291B1

8582C6

736EE0

Tritanopia

A2CCC7

A2ACAB

8DADAC

79BEBC

5FD2CE

Achromatopsia

9E9E9E

A1A1A1

9B9B9B

979797

929292

Shades & Tints Shades & Tints

#A389FF

Dark

Light

#A29CB8

Dark

Light

#8C9DBA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a389ff;
  --color-2: #a29cb8;
  --color-3: #8c9dba;
  --color-4: #779bd9;
  --color-5: #5c98ff;
}

SCSS

$color-1: #a389ff;
$color-2: #a29cb8;
$color-3: #8c9dba;
$color-4: #779bd9;
$color-5: #5c98ff;

TAILWIND

colors: {
  'brand-1': '#a389ff',
  'brand-2': '#a29cb8',
  'brand-3': '#8c9dba',
  'brand-4': '#779bd9',
  'brand-5': '#5c98ff',
}

RGB Array

[163, 137, 255], [162, 156, 184], [140, 157, 186], [119, 155, 217], [92, 152, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A389FF, #A29CB8, #8C9DBA, #779BD9, #5C98FF 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: #a389ff; --color-2: #a29cb8; --color-3: #8c9dba; --color-4: #779bd9; --color-5: #5c98ff. 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