← Back to Editor

#C2A6F4 · #9E9AB5 · #687D82 · #466267 · #701C56

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#C2A6F4

Wisteria · LightSteelBlue · Lilac Purple

HEX
#C2A6F4
RGB
rgb(194, 166, 244)
HSL
hsl(262, 78%, 80%)
HSB
hsb(262, 32%, 96%)
CMYK
cmyk(20%, 32%, 0%, 4%)
Oklch
oklch(77.8% 0.113 300.3)

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

#9E9AB5

Wisteria · DarkGray · Cobalt Blue

HEX
#9E9AB5
RGB
rgb(158, 154, 181)
HSL
hsl(249, 15%, 66%)
HSB
hsb(249, 15%, 71%)
CMYK
cmyk(13%, 15%, 0%, 29%)
Oklch
oklch(69.9% 0.039 292.1)

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

#687D82

Slate Blue · SlateGray · Mint Ice

HEX
#687D82
RGB
rgb(104, 125, 130)
HSL
hsl(192, 11%, 46%)
HSB
hsb(192, 20%, 51%)
CMYK
cmyk(20%, 4%, 0%, 49%)
Oklch
oklch(57.5% 0.026 213.7)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#466267

Slate Blue · DimGray · Mint Ice

HEX
#466267
RGB
rgb(70, 98, 103)
HSL
hsl(189, 19%, 34%)
HSB
hsb(189, 32%, 40%)
CMYK
cmyk(32%, 5%, 0%, 60%)
Oklch
oklch(47.6% 0.034 209.8)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#701C56

Rose Purple · Purple · Eggplant

HEX
#701C56
RGB
rgb(112, 28, 86)
HSL
hsl(319, 60%, 27%)
HSB
hsb(319, 75%, 44%)
CMYK
cmyk(0%, 75%, 23%, 56%)
Oklch
oklch(38.5% 0.134 342.9)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C2A6F4
D7F4A4

Analogous

A4AFF4
C2A6F4
E9A4F4

Triadic

C2A6F4
F4C1A4
A4F4C1

Split-Comp.

C2A6F4
F4E9A4
AFF4A4

Tetradic

C2A6F4
F4A4AF
D7F4A4
A4F4E9

Contrast Matrix WCAG 2.1 Contrast

C2A6F4
9E9AB5
687D82
466267
701C56
—
1.3
Fail
2.1
Fail
3.1
AA Large
5.1
AA
1.3
Fail
—
1.6
Fail
2.4
Fail
3.9
AA Large
2.1
Fail
1.6
Fail
—
1.5
Fail
2.4
Fail
3.1
AA Large
2.4
Fail
1.5
Fail
—
1.6
Fail
5.1
AA
3.9
AA Large
2.4
Fail
1.6
Fail
—
White BG
2.1Fail
2.7Fail
4.3AA Large
6.6AA
10.6AAA
Black BG
10.1AAA
7.7AAA
4.8AA
3.2AA Large
2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B6E1
9C9CAE
717181
525266
4C4B48

Deuteranopia

B8BADD
9D9DAD
706E81
514E66
515745

Tritanopia

C1D2CF
9EA9A8
698080
476565
6C3D3A

Achromatopsia

B7B7B7
9E9E9E
777777
5A5A5A
3C3C3C

Shades & Tints Shades & Tints

#C2A6F4

Dark
Light

#9E9AB5

Dark
Light

#687D82

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c2a6f4;
  --color-2: #9e9ab5;
  --color-3: #687d82;
  --color-4: #466267;
  --color-5: #701c56;
}

SCSS

$color-1: #c2a6f4;
$color-2: #9e9ab5;
$color-3: #687d82;
$color-4: #466267;
$color-5: #701c56;

TAILWIND

colors: {
  'brand-1': '#c2a6f4',
  'brand-2': '#9e9ab5',
  'brand-3': '#687d82',
  'brand-4': '#466267',
  'brand-5': '#701c56',
}

RGB Array

[194, 166, 244], [158, 154, 181], [104, 125, 130], [70, 98, 103], [112, 28, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C2A6F4, #9E9AB5, #687D82, #466267, #701C56 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #c2a6f4; --color-2: #9e9ab5; --color-3: #687d82; --color-4: #466267; --color-5: #701c56. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. 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