#AB9B9C + #D1A1E7 + #C4CBD4 + #B6E3D3 + #D3EBB7 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#AB9B9C

Peach Pink · DarkGray · Silver Sand

HEX

#AB9B9C

RGB

rgb(171, 155, 156)

HSL

hsl(356, 9%, 64%)

HSB

hsb(356, 9%, 67%)

CMYK

cmyk(0%, 9%, 9%, 33%)

Oklch

oklch(70.4% 0.019 13.3)

Traditional「Peach Pink」· Paint「Silver Sand」· Creative Urban Concrete

#D1A1E7

Lilac · Violet · Lilac Purple

HEX

#D1A1E7

RGB

rgb(209, 161, 231)

HSL

hsl(281, 59%, 77%)

HSB

hsb(281, 30%, 91%)

CMYK

cmyk(10%, 30%, 0%, 9%)

Oklch

oklch(77.7% 0.110 314.9)

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

#C4CBD4

Azure · LightGray · Cobalt Blue

HEX

#C4CBD4

RGB

rgb(196, 203, 212)

HSL

hsl(214, 16%, 80%)

HSB

hsb(214, 8%, 83%)

CMYK

cmyk(8%, 4%, 0%, 17%)

Oklch

oklch(83.9% 0.015 254.6)

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

#B6E3D3

Jade · LightBlue · Apple Green

HEX

#B6E3D3

RGB

rgb(182, 227, 211)

HSL

hsl(159, 45%, 80%)

HSB

hsb(159, 20%, 89%)

CMYK

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

Oklch

oklch(88.0% 0.052 171.4)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#D3EBB7

Willow Green · Wheat · Mint Green

HEX

#D3EBB7

RGB

rgb(211, 235, 183)

HSL

hsl(88, 57%, 82%)

HSB

hsb(88, 22%, 92%)

CMYK

cmyk(10%, 0%, 22%, 8%)

Oklch

oklch(90.9% 0.073 127.9)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AB9B9C

9BABAA

Analogous

AB9BA4

AB9B9C

ABA29B

Triadic

AB9B9C

9CAB9B

9B9CAB

Split-Comp.

AB9B9C

9BABA2

9BA4AB

Tetradic

AB9B9C

A4AB9B

9BABAA

A29BAB

Contrast Matrix WCAG 2.1 Contrast

AB9B9C	D1A1E7	C4CBD4	B6E3D3	D3EBB7
—	1.3 Fail	1.6 Fail	1.9 Fail	2.1 Fail
1.3 Fail	—	1.3 Fail	1.5 Fail	1.6 Fail
1.6 Fail	1.3 Fail	—	1.2 Fail	1.3 Fail
1.9 Fail	1.5 Fail	1.2 Fail	—	1.1 Fail
2.1 Fail	1.6 Fail	1.3 Fail	1.1 Fail	—

White BG

2.7Fail

2.1Fail

1.6Fail

1.4Fail

1.3Fail

Black BG

7.9AAA

10.0AAA

12.8AAA

14.9AAA

16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A49C

BCBCD6

C7C7D2

C9CAD7

DDDEC4

Deuteranopia

A5A69C

BFC3D2

C7C6D1

C7C4D8

DCDAC7

Tritanopia

AA9C9C

CFC9C6

C4D0D0

B8DADB

D4CED0

Achromatopsia

A0A0A0

B7B7B7

CACACA

D4D4D4

DEDEDE

Shades & Tints Shades & Tints

#AB9B9C

Dark

Light

#D1A1E7

Dark

Light

#C4CBD4

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ab9b9c;
  --color-2: #d1a1e7;
  --color-3: #c4cbd4;
  --color-4: #b6e3d3;
  --color-5: #d3ebb7;
}

SCSS

$color-1: #ab9b9c;
$color-2: #d1a1e7;
$color-3: #c4cbd4;
$color-4: #b6e3d3;
$color-5: #d3ebb7;

TAILWIND

colors: {
  'brand-1': '#ab9b9c',
  'brand-2': '#d1a1e7',
  'brand-3': '#c4cbd4',
  'brand-4': '#b6e3d3',
  'brand-5': '#d3ebb7',
}

RGB Array

[171, 155, 156], [209, 161, 231], [196, 203, 212], [182, 227, 211], [211, 235, 183]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AB9B9C, #D1A1E7, #C4CBD4, #B6E3D3, #D3EBB7 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: #ab9b9c; --color-2: #d1a1e7; --color-3: #c4cbd4; --color-4: #b6e3d3; --color-5: #d3ebb7. 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