#A6AEC9 + #D4B1F8 + #CC97BE + #CC76B5 + #CC5DAF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A6AEC9

Azure · LightSteelBlue · Cobalt Blue

HEX

#A6AEC9

RGB

rgb(166, 174, 201)

HSL

hsl(226, 24%, 72%)

HSB

hsb(226, 17%, 79%)

CMYK

cmyk(17%, 13%, 0%, 21%)

Oklch

oklch(75.3% 0.040 272.4)

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

#D4B1F8

Lilac · LightSteelBlue · Lavender

HEX

#D4B1F8

RGB

rgb(212, 177, 248)

HSL

hsl(270, 84%, 83%)

HSB

hsb(270, 29%, 97%)

CMYK

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

Oklch

oklch(81.5% 0.104 306.7)

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

#CC97BE

Mauve · Silver · Lilac Purple

HEX

#CC97BE

RGB

rgb(204, 151, 190)

HSL

hsl(316, 34%, 70%)

HSB

hsb(316, 26%, 80%)

CMYK

cmyk(0%, 26%, 7%, 20%)

Oklch

oklch(73.9% 0.082 336.2)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#CC76B5

Mauve · Orchid · Lilac Purple

HEX

#CC76B5

RGB

rgb(204, 118, 181)

HSL

hsl(316, 46%, 63%)

HSB

hsb(316, 42%, 80%)

CMYK

cmyk(0%, 42%, 11%, 20%)

Oklch

oklch(68.0% 0.133 337.7)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#CC5DAF

Rose Purple · MediumOrchid · Violet

HEX

#CC5DAF

RGB

rgb(204, 93, 175)

HSL

hsl(316, 52%, 58%)

HSB

hsb(316, 54%, 80%)

CMYK

cmyk(0%, 54%, 14%, 20%)

Oklch

oklch(64.1% 0.170 338.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A6AEC9

C9C1A6

Analogous

A6C0C9

A6AEC9

B0A6C9

Triadic

A6AEC9

C9A6AE

AEC9A6

Split-Comp.

A6AEC9

C9B0A6

C0C9A6

Tetradic

A6AEC9

C9A6C0

C9C1A6

A6C9B0

Contrast Matrix WCAG 2.1 Contrast

A6AEC9	D4B1F8	CC97BE	CC76B5	CC5DAF
—	1.2 Fail	1.1 Fail	1.4 Fail	1.7 Fail
1.2 Fail	—	1.3 Fail	1.7 Fail	2.0 Fail
1.1 Fail	1.3 Fail	—	1.3 Fail	1.5 Fail
1.4 Fail	1.7 Fail	1.3 Fail	—	1.2 Fail
1.7 Fail	2.0 Fail	1.5 Fail	1.2 Fail	—

White BG

2.2Fail

1.8Fail

2.4Fail

3.1AA Large

3.7AA Large

Black BG

9.5AAA

11.4AAA

8.7AAA

6.8AA

5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9AAC2

C5C5E7

B5B5B5

A7A6A6

9C9B9B

Deuteranopia

A9A8C1

C7C9E3

B8BCB2

ACB2A2

A2AB96

Tritanopia

A6BDBC

D2D9D6

C9ADAB

C89A97

C68B88

Achromatopsia

AFAFAF

C4C4C4

ABABAB

979797

888888

Shades & Tints Shades & Tints

#A6AEC9

Dark

Light

#D4B1F8

Dark

Light

#CC97BE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a6aec9;
  --color-2: #d4b1f8;
  --color-3: #cc97be;
  --color-4: #cc76b5;
  --color-5: #cc5daf;
}

SCSS

$color-1: #a6aec9;
$color-2: #d4b1f8;
$color-3: #cc97be;
$color-4: #cc76b5;
$color-5: #cc5daf;

TAILWIND

colors: {
  'brand-1': '#a6aec9',
  'brand-2': '#d4b1f8',
  'brand-3': '#cc97be',
  'brand-4': '#cc76b5',
  'brand-5': '#cc5daf',
}

RGB Array

[166, 174, 201], [212, 177, 248], [204, 151, 190], [204, 118, 181], [204, 93, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A6AEC9, #D4B1F8, #CC97BE, #CC76B5, #CC5DAF 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: #a6aec9; --color-2: #d4b1f8; --color-3: #cc97be; --color-4: #cc76b5; --color-5: #cc5daf. 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