← Back to Editor

#637270 · #C99EB0 · #DAB9C3 · #D8D1DB · #EAF1EE

dark

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#637270

Ink Gray · DimGray · Warm Gray

HEX
#637270
RGB
rgb(99, 114, 112)
HSL
hsl(172, 7%, 42%)
HSB
hsb(172, 13%, 45%)
CMYK
cmyk(13%, 0%, 2%, 55%)
Oklch
oklch(53.9% 0.018 186.9)

TraditionalInk Gray」· PaintWarm Gray」· Creative Urban Concrete

#C99EB0

Rouge · DarkGray · Rose Pink

HEX
#C99EB0
RGB
rgb(201, 158, 176)
HSL
hsl(335, 28%, 70%)
HSB
hsb(335, 21%, 79%)
CMYK
cmyk(0%, 21%, 12%, 21%)
Oklch
oklch(74.4% 0.056 351.6)

TraditionalRouge」· PaintRose Pink」· Creative Rose Petal

#DAB9C3

Rouge · Silver · Cherry Blossom

HEX
#DAB9C3
RGB
rgb(218, 185, 195)
HSL
hsl(342, 31%, 79%)
HSB
hsb(342, 15%, 85%)
CMYK
cmyk(0%, 15%, 11%, 15%)
Oklch
oklch(81.7% 0.040 357.8)

TraditionalRouge」· PaintCherry Blossom」· Creative Rose Petal

#D8D1DB

Lilac · LightGray · Lavender

HEX
#D8D1DB
RGB
rgb(216, 209, 219)
HSL
hsl(282, 12%, 84%)
HSB
hsb(282, 5%, 86%)
CMYK
cmyk(1%, 5%, 0%, 14%)
Oklch
oklch(86.9% 0.016 316.0)

TraditionalLilac」· PaintLavender」· Creative Lavender Dream

#EAF1EE

Jade · Lavender · Mint Green

HEX
#EAF1EE
RGB
rgb(234, 241, 238)
HSL
hsl(154, 20%, 93%)
HSB
hsb(154, 3%, 95%)
CMYK
cmyk(3%, 0%, 1%, 5%)
Oklch
oklch(95.2% 0.008 168.7)

TraditionalJade」· PaintMint Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

637270
736466

Analogous

647369
637270
646D73

Triadic

637270
716473
737164

Split-Comp.

637270
73646D
736964

Tetradic

637270
696473
736466
6D7364

Contrast Matrix WCAG 2.1 Contrast

637270
C99EB0
DAB9C3
D8D1DB
EAF1EE
2.2
Fail
2.8
Fail
3.4
AA Large
4.4
AA Large
2.2
Fail
1.3
Fail
1.6
Fail
2.0
Fail
2.8
Fail
1.3
Fail
1.2
Fail
1.6
Fail
3.4
AA Large
1.6
Fail
1.2
Fail
1.3
Fail
4.4
AA Large
2.0
Fail
1.6
Fail
1.3
Fail
White BG
5.0AA
2.3Fail
1.8Fail
1.5Fail
1.1Fail
Black BG
4.2AA Large
9.0AAA
11.7AAA
14.1AAA
18.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

696A70
B6B6AC
CCCBC1
D5D5D9
EDEDEF

Deuteranopia

696871
B9BCAB
CED0C0
D5D6D8
EDECEF

Tritanopia

647171
C7A8A7
D8BFBE
D8D7D6
EAEFEF

Achromatopsia

6D6D6D
ADADAD
C4C4C4
D4D4D4
EFEFEF

Shades & Tints Shades & Tints

#637270

Dark
Light

#C99EB0

Dark
Light

#DAB9C3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #637270;
  --color-2: #c99eb0;
  --color-3: #dab9c3;
  --color-4: #d8d1db;
  --color-5: #eaf1ee;
}

SCSS

$color-1: #637270;
$color-2: #c99eb0;
$color-3: #dab9c3;
$color-4: #d8d1db;
$color-5: #eaf1ee;

TAILWIND

colors: {
  'brand-1': '#637270',
  'brand-2': '#c99eb0',
  'brand-3': '#dab9c3',
  'brand-4': '#d8d1db',
  'brand-5': '#eaf1ee',
}

RGB Array

[99, 114, 112], [201, 158, 176], [218, 185, 195], [216, 209, 219], [234, 241, 238]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #637270, #C99EB0, #DAB9C3, #D8D1DB, #EAF1EE is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #637270; --color-2: #c99eb0; --color-3: #dab9c3; --color-4: #d8d1db; --color-5: #eaf1ee. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 dark-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