← Back to Editor

#D5CCE3 · #A7CACC · #7CB99F · #9998A6 · #AD86AC

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D5CCE3

Wisteria · LightGray · Lavender

HEX
#D5CCE3
RGB
rgb(213, 204, 227)
HSL
hsl(263, 29%, 85%)
HSB
hsb(263, 10%, 89%)
CMYK
cmyk(6%, 10%, 0%, 11%)
Oklch
oklch(85.9% 0.033 303.4)

TraditionalWisteria」· PaintLavender」· Creative Lavender Dream

#A7CACC

Sky Blue · LightSteelBlue · Lake Green

HEX
#A7CACC
RGB
rgb(167, 202, 204)
HSL
hsl(183, 27%, 73%)
HSB
hsb(183, 18%, 80%)
CMYK
cmyk(18%, 1%, 0%, 20%)
Oklch
oklch(81.4% 0.037 200.7)

TraditionalSky Blue」· PaintLake Green」· Creative Arctic Pool

#7CB99F

Jade · DarkSeaGreen · Apple Green

HEX
#7CB99F
RGB
rgb(124, 185, 159)
HSL
hsl(154, 30%, 61%)
HSB
hsb(154, 33%, 73%)
CMYK
cmyk(33%, 0%, 14%, 27%)
Oklch
oklch(73.7% 0.074 165.9)

TraditionalJade」· PaintApple Green」· Creative Arctic Pool

#9998A6

Ash · DarkGray · Silver Sand

HEX
#9998A6
RGB
rgb(153, 152, 166)
HSL
hsl(244, 7%, 62%)
HSB
hsb(244, 8%, 65%)
CMYK
cmyk(8%, 8%, 0%, 35%)
Oklch
oklch(68.5% 0.020 289.1)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#AD86AC

Rose Purple · DarkGray · Violet

HEX
#AD86AC
RGB
rgb(173, 134, 172)
HSL
hsl(302, 19%, 60%)
HSB
hsb(302, 23%, 68%)
CMYK
cmyk(0%, 23%, 1%, 32%)
Oklch
oklch(67.0% 0.071 327.2)

TraditionalRose Purple」· PaintViolet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5CCE3
DBE4CE

Analogous

CED0E4
D5CCE3
E1CEE4

Triadic

D5CCE3
E4D6CE
CEE4D6

Split-Comp.

D5CCE3
E4E1CE
D0E4CE

Tetradic

D5CCE3
E4CED0
DBE4CE
CEE4E1

Contrast Matrix WCAG 2.1 Contrast

D5CCE3
A7CACC
7CB99F
9998A6
AD86AC
1.1
Fail
1.5
Fail
1.8
Fail
2.0
Fail
1.1
Fail
1.3
Fail
1.6
Fail
1.8
Fail
1.5
Fail
1.3
Fail
1.3
Fail
1.4
Fail
1.8
Fail
1.6
Fail
1.3
Fail
1.1
Fail
2.0
Fail
1.8
Fail
1.4
Fail
1.1
Fail
White BG
1.5Fail
1.8Fail
2.3Fail
2.8Fail
3.1AA Large
Black BG
13.6AAA
12.0AAA
9.3AAA
7.4AAA
6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D1D1DD
B6B6CC
9697A5
9999A3
9C9CA3

Deuteranopia

D2D2DC
B4B2CB
938EA7
9999A2
9EA1A1

Tritanopia

D5D9D8
A9CBCB
7FAAAB
99A09F
AB9C9A

Achromatopsia

D1D1D1
C0C0C0
A4A4A4
9A9A9A
969696

Shades & Tints Shades & Tints

#D5CCE3

Dark
Light

#A7CACC

Dark
Light

#7CB99F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5cce3;
  --color-2: #a7cacc;
  --color-3: #7cb99f;
  --color-4: #9998a6;
  --color-5: #ad86ac;
}

SCSS

$color-1: #d5cce3;
$color-2: #a7cacc;
$color-3: #7cb99f;
$color-4: #9998a6;
$color-5: #ad86ac;

TAILWIND

colors: {
  'brand-1': '#d5cce3',
  'brand-2': '#a7cacc',
  'brand-3': '#7cb99f',
  'brand-4': '#9998a6',
  'brand-5': '#ad86ac',
}

RGB Array

[213, 204, 227], [167, 202, 204], [124, 185, 159], [153, 152, 166], [173, 134, 172]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D5CCE3, #A7CACC, #7CB99F, #9998A6, #AD86AC is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d5cce3; --color-2: #a7cacc; --color-3: #7cb99f; --color-4: #9998a6; --color-5: #ad86ac. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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