#8197C6 + #A5A5E3 + #CB95D5 + #FBC9FE + #FAECFB · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#8197C6

Azure · LightSlateGray · Cobalt Blue

HEX

#8197C6

RGB

rgb(129, 151, 198)

HSL

hsl(221, 38%, 64%)

HSB

hsb(221, 35%, 78%)

CMYK

cmyk(35%, 24%, 0%, 22%)

Oklch

oklch(67.7% 0.074 265.0)

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

#A5A5E3

Wisteria · LightSteelBlue · Cobalt Blue

HEX

#A5A5E3

RGB

rgb(165, 165, 227)

HSL

hsl(240, 53%, 77%)

HSB

hsb(240, 27%, 89%)

CMYK

cmyk(27%, 27%, 0%, 11%)

Oklch

oklch(74.5% 0.089 284.0)

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

#CB95D5

Lilac · Orchid · Lilac Purple

HEX

#CB95D5

RGB

rgb(203, 149, 213)

HSL

hsl(291, 43%, 71%)

HSB

hsb(291, 30%, 84%)

CMYK

cmyk(5%, 30%, 0%, 16%)

Oklch

oklch(74.3% 0.107 321.1)

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

#FBC9FE

Lilac · Lavender · Lavender

HEX

#FBC9FE

RGB

rgb(251, 201, 254)

HSL

hsl(297, 96%, 89%)

HSB

hsb(297, 21%, 100%)

CMYK

cmyk(1%, 21%, 0%, 0%)

Oklch

oklch(89.6% 0.089 324.5)

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

#FAECFB

Lilac · Snow · Lavender

HEX

#FAECFB

RGB

rgb(250, 236, 251)

HSL

hsl(296, 65%, 95%)

HSB

hsb(296, 6%, 98%)

CMYK

cmyk(0%, 6%, 0%, 2%)

Oklch

oklch(95.8% 0.025 323.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8197C6

C6B080

Analogous

80B9C6

8197C6

8D80C6

Triadic

8197C6

C68096

96C680

Split-Comp.

8197C6

C68D80

B9C680

Tetradic

8197C6

C680B9

C6B080

80C68D

Contrast Matrix WCAG 2.1 Contrast

8197C6	A5A5E3	CB95D5	FBC9FE	FAECFB
—	1.3 Fail	1.2 Fail	2.1 Fail	2.6 Fail
1.3 Fail	—	1.0 Fail	1.6 Fail	2.0 Fail
1.2 Fail	1.0 Fail	—	1.7 Fail	2.1 Fail
2.1 Fail	1.6 Fail	1.7 Fail	—	1.2 Fail
2.6 Fail	2.0 Fail	2.1 Fail	1.2 Fail	—

White BG

2.9Fail

2.3Fail

2.4Fail

1.4Fail

1.1Fail

Black BG

7.2AAA

9.1AAA

8.8AAA

14.9AAA

18.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8B8BBB

A5A5D4

B4B3C6

E5E5F1

F4F4F7

Deuteranopia

8988B8

A5A5D0

B7BBC2

E8ECEE

F5F6F7

Tritanopia

82B2B0

A5C8C6

C8B9B7

F9E7E5

F9F5F4

Achromatopsia

969696

ACACAC

DEDEDE

F2F2F2

Shades & Tints Shades & Tints

#8197C6

Dark

Light

#A5A5E3

Dark

Light

#CB95D5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8197c6;
  --color-2: #a5a5e3;
  --color-3: #cb95d5;
  --color-4: #fbc9fe;
  --color-5: #faecfb;
}

SCSS

$color-1: #8197c6;
$color-2: #a5a5e3;
$color-3: #cb95d5;
$color-4: #fbc9fe;
$color-5: #faecfb;

TAILWIND

colors: {
  'brand-1': '#8197c6',
  'brand-2': '#a5a5e3',
  'brand-3': '#cb95d5',
  'brand-4': '#fbc9fe',
  'brand-5': '#faecfb',
}

RGB Array

[129, 151, 198], [165, 165, 227], [203, 149, 213], [251, 201, 254], [250, 236, 251]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #8197C6, #A5A5E3, #CB95D5, #FBC9FE, #FAECFB 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: #8197c6; --color-2: #a5a5e3; --color-3: #cb95d5; --color-4: #fbc9fe; --color-5: #faecfb. 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 pastel-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