← Back to Editor

#D5EBCC · #98AEAB · #6C8281 · #41394C · #3C1A30

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#D5EBCC

Celadon · LightGray · Mint Green

HEX
#D5EBCC
RGB
rgb(213, 235, 204)
HSL
hsl(103, 44%, 86%)
HSB
hsb(103, 13%, 92%)
CMYK
cmyk(9%, 0%, 13%, 8%)
Oklch
oklch(91.6% 0.048 136.5)

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

#98AEAB

Jade · DarkGray · Lake Green

HEX
#98AEAB
RGB
rgb(152, 174, 171)
HSL
hsl(172, 12%, 64%)
HSB
hsb(172, 13%, 68%)
CMYK
cmyk(13%, 0%, 2%, 32%)
Oklch
oklch(73.3% 0.025 186.7)

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

#6C8281

Mineral Blue · SlateGray · Warm Gray

HEX
#6C8281
RGB
rgb(108, 130, 129)
HSL
hsl(177, 9%, 47%)
HSB
hsb(177, 17%, 51%)
CMYK
cmyk(17%, 0%, 1%, 49%)
Oklch
oklch(58.9% 0.026 193.1)

Traditional「Mineral Blue」· Paint「Warm Gray」· Creative Urban Concrete

#41394C

Deep Indigo · DarkSlateGray · Eggplant

HEX
#41394C
RGB
rgb(65, 57, 76)
HSL
hsl(265, 14%, 26%)
HSB
hsb(265, 25%, 30%)
CMYK
cmyk(14%, 25%, 0%, 70%)
Oklch
oklch(36.1% 0.034 303.9)

Traditional「Deep Indigo」· Paint「Eggplant」· Creative Blush Sunrise

#3C1A30

Rose Purple · DarkSlateGray · Raspberry

HEX
#3C1A30
RGB
rgb(60, 26, 48)
HSL
hsl(321, 40%, 17%)
HSB
hsb(321, 57%, 24%)
CMYK
cmyk(0%, 57%, 20%, 76%)
Oklch
oklch(27.6% 0.062 342.5)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5EBCC
E2CCEB

Analogous

E4EBCC
D5EBCC
CCEBD2

Triadic

D5EBCC
CCD4EB
EBCCD4

Split-Comp.

D5EBCC
D2CCEB
EBCCE4

Tetradic

D5EBCC
CCE4EB
E2CCEB
EBD2CC

Contrast Matrix WCAG 2.1 Contrast

D5EBCC
98AEAB
6C8281
41394C
3C1A30
—
1.8
Fail
3.2
AA Large
8.7
AAA
12.0
AAA
1.8
Fail
—
1.7
Fail
4.7
AA
6.5
AA
3.2
AA Large
1.7
Fail
—
2.7
Fail
3.7
AA Large
8.7
AAA
4.7
AA
2.7
Fail
—
1.4
Fail
12.0
AAA
6.5
AA
3.7
AA Large
1.4
Fail
—
White BG
1.3Fail
2.3Fail
4.1AA Large
11.0AAA
15.2AAA
Black BG
16.6AAA
9.0AAA
5.1AA
1.9Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDFD4
A2A2AC
767681
3E3D47
2D2D2B

Deuteranopia

DDDCD5
A09FAC
747381
3E3F46
2F3229

Tritanopia

D6D9DB
99ACAC
6D8181
414443
3A2626

Achromatopsia

E1E1E1
A7A7A7
7B7B7B
3E3E3E
272727

Shades & Tints Shades & Tints

#D5EBCC

Dark
Light

#98AEAB

Dark
Light

#6C8281

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5ebcc;
  --color-2: #98aeab;
  --color-3: #6c8281;
  --color-4: #41394c;
  --color-5: #3c1a30;
}

SCSS

$color-1: #d5ebcc;
$color-2: #98aeab;
$color-3: #6c8281;
$color-4: #41394c;
$color-5: #3c1a30;

TAILWIND

colors: {
  'brand-1': '#d5ebcc',
  'brand-2': '#98aeab',
  'brand-3': '#6c8281',
  'brand-4': '#41394c',
  'brand-5': '#3c1a30',
}

RGB Array

[213, 235, 204], [152, 174, 171], [108, 130, 129], [65, 57, 76], [60, 26, 48]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D5EBCC, #98AEAB, #6C8281, #41394C, #3C1A30 is ideal for: brand design, premium product pages, magazine layouts, 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: #d5ebcc; --color-2: #98aeab; --color-3: #6c8281; --color-4: #41394c; --color-5: #3c1a30. 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. 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 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