← Back to Editor

#D1DBCC · #91D2B7 · #62B3B1 · #7193AD · #8B71AE

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D1DBCC

Celadon · LightGray · Mint Green

HEX
#D1DBCC
RGB
rgb(209, 219, 204)
HSL
hsl(100, 17%, 83%)
HSB
hsb(100, 7%, 86%)
CMYK
cmyk(5%, 0%, 7%, 14%)
Oklch
oklch(88.0% 0.023 135.0)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#91D2B7

Jade · MediumAquaMarine · Apple Green

HEX
#91D2B7
RGB
rgb(145, 210, 183)
HSL
hsl(155, 42%, 70%)
HSB
hsb(155, 31%, 82%)
CMYK
cmyk(31%, 0%, 13%, 18%)
Oklch
oklch(81.2% 0.077 166.7)

TraditionalJade」· PaintApple Green」· Creative Arctic Pool

#62B3B1

Mineral Blue · CadetBlue · Lake Green

HEX
#62B3B1
RGB
rgb(98, 179, 177)
HSL
hsl(179, 35%, 54%)
HSB
hsb(179, 45%, 70%)
CMYK
cmyk(45%, 0%, 1%, 30%)
Oklch
oklch(71.5% 0.080 193.4)

TraditionalMineral Blue」· PaintLake Green」· Creative Blush Sunrise

#7193AD

Slate Blue · LightSlateGray · Navy Blue

HEX
#7193AD
RGB
rgb(113, 147, 173)
HSL
hsl(206, 27%, 56%)
HSB
hsb(206, 35%, 68%)
CMYK
cmyk(35%, 15%, 0%, 32%)
Oklch
oklch(64.7% 0.054 241.6)

TraditionalSlate Blue」· PaintNavy Blue」· Creative Blush Sunrise

#8B71AE

Deep Indigo · LightSlateGray · Violet

HEX
#8B71AE
RGB
rgb(139, 113, 174)
HSL
hsl(266, 27%, 56%)
HSB
hsb(266, 35%, 68%)
CMYK
cmyk(20%, 35%, 0%, 32%)
Oklch
oklch(59.7% 0.095 303.2)

TraditionalDeep Indigo」· PaintViolet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D1DBCC
D6CCDB

Analogous

D9DBCC
D1DBCC
CCDBCF

Triadic

D1DBCC
CCD1DB
DBCCD1

Split-Comp.

D1DBCC
CFCCDB
DBCCD9

Tetradic

D1DBCC
CCD9DB
D6CCDB
DBCFCC

Contrast Matrix WCAG 2.1 Contrast

D1DBCC
91D2B7
62B3B1
7193AD
8B71AE
1.2
Fail
1.7
Fail
2.3
Fail
2.9
Fail
1.2
Fail
1.4
Fail
1.9
Fail
2.4
Fail
1.7
Fail
1.4
Fail
1.3
Fail
1.7
Fail
2.3
Fail
1.9
Fail
1.3
Fail
1.3
Fail
2.9
Fail
2.4
Fail
1.7
Fail
1.3
Fail
White BG
1.4Fail
1.7Fail
2.4Fail
3.2AA Large
4.1AA Large
Black BG
14.7AAA
12.1AAA
8.6AAA
6.5AA
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D5D5D0
ADAEBE
8586B1
8080A7
80809F

Deuteranopia

D5D4D1
A9A5BF
807AB2
7E7BA5
81839C

Tritanopia

D1D2D3
94C3C4
66B2B2
73A2A1
8A9491

Achromatopsia

D6D6D6
BBBBBB
9B9B9B
8C8C8C
808080

Shades & Tints Shades & Tints

#D1DBCC

Dark
Light

#91D2B7

Dark
Light

#62B3B1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d1dbcc;
  --color-2: #91d2b7;
  --color-3: #62b3b1;
  --color-4: #7193ad;
  --color-5: #8b71ae;
}

SCSS

$color-1: #d1dbcc;
$color-2: #91d2b7;
$color-3: #62b3b1;
$color-4: #7193ad;
$color-5: #8b71ae;

TAILWIND

colors: {
  'brand-1': '#d1dbcc',
  'brand-2': '#91d2b7',
  'brand-3': '#62b3b1',
  'brand-4': '#7193ad',
  'brand-5': '#8b71ae',
}

RGB Array

[209, 219, 204], [145, 210, 183], [98, 179, 177], [113, 147, 173], [139, 113, 174]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D1DBCC, #91D2B7, #62B3B1, #7193AD, #8B71AE is ideal for: brand design, premium product pages, magazine layouts. 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: #d1dbcc; --color-2: #91d2b7; --color-3: #62b3b1; --color-4: #7193ad; --color-5: #8b71ae. 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. 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. 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