← Back to Editor

#DEDEDE · #CAEDDA · #C5D4C3 · #B1A3B7 · #91868E

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DEDEDE

Plain White · LightGray · Cloud White

HEX
#DEDEDE
RGB
rgb(222, 222, 222)
HSL
hsl(0, 0%, 87%)
HSB
hsb(0, 0%, 87%)
CMYK
cmyk(0%, 0%, 0%, 13%)
Oklch
oklch(90.1% 0.000 89.9)

TraditionalPlain White」· PaintCloud White」· Creative Silver Lining

#CAEDDA

Celadon · LightGray · Mint Green

HEX
#CAEDDA
RGB
rgb(202, 237, 218)
HSL
hsl(147, 49%, 86%)
HSB
hsb(147, 15%, 93%)
CMYK
cmyk(15%, 0%, 8%, 7%)
Oklch
oklch(91.6% 0.045 161.7)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#C5D4C3

Celadon · Silver · Apple Green

HEX
#C5D4C3
RGB
rgb(197, 212, 195)
HSL
hsl(113, 17%, 80%)
HSB
hsb(113, 8%, 83%)
CMYK
cmyk(7%, 0%, 8%, 17%)
Oklch
oklch(85.4% 0.028 142.0)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#B1A3B7

Lilac · DarkGray · Lilac Purple

HEX
#B1A3B7
RGB
rgb(177, 163, 183)
HSL
hsl(282, 12%, 68%)
HSB
hsb(282, 11%, 72%)
CMYK
cmyk(3%, 11%, 0%, 28%)
Oklch
oklch(73.4% 0.032 315.9)

TraditionalLilac」· PaintLilac Purple」· Creative Lavender Dream

#91868E

Ash · Gray · Warm Gray

HEX
#91868E
RGB
rgb(145, 134, 142)
HSL
hsl(316, 5%, 55%)
HSB
hsb(316, 8%, 57%)
CMYK
cmyk(0%, 8%, 2%, 43%)
Oklch
oklch(63.2% 0.018 335.3)

TraditionalAsh」· PaintWarm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DEDEDE
DEDEDE

Analogous

DEDEDE
DEDEDE
DEDEDE

Triadic

DEDEDE
DEDEDE
DEDEDE

Split-Comp.

DEDEDE
DEDEDE
DEDEDE

Tetradic

DEDEDE
DEDEDE
DEDEDE
DEDEDE

Contrast Matrix WCAG 2.1 Contrast

DEDEDE
CAEDDA
C5D4C3
B1A3B7
91868E
1.1
Fail
1.1
Fail
1.8
Fail
2.6
Fail
1.1
Fail
1.2
Fail
1.9
Fail
2.8
Fail
1.1
Fail
1.2
Fail
1.5
Fail
2.3
Fail
1.8
Fail
1.9
Fail
1.5
Fail
1.5
Fail
2.6
Fail
2.8
Fail
2.3
Fail
1.5
Fail
White BG
1.3Fail
1.3Fail
1.5Fail
2.4Fail
3.5AA Large
Black BG
15.6AAA
16.6AAA
13.6AAA
8.8AAA
6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDEDE
D9D9DF
CBCCC7
ABABB2
8C8C8C

Deuteranopia

DEDEDE
D7D4E0
CBC9C8
ACADB1
8D8E8C

Tritanopia

DEDEDE
CCE2E3
C6CACB
B0AEAE
908B8A

Achromatopsia

DEDEDE
E0E0E0
CECECE
A9A9A9
8A8A8A

Shades & Tints Shades & Tints

#DEDEDE

Dark
Light

#CAEDDA

Dark
Light

#C5D4C3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dedede;
  --color-2: #caedda;
  --color-3: #c5d4c3;
  --color-4: #b1a3b7;
  --color-5: #91868e;
}

SCSS

$color-1: #dedede;
$color-2: #caedda;
$color-3: #c5d4c3;
$color-4: #b1a3b7;
$color-5: #91868e;

TAILWIND

colors: {
  'brand-1': '#dedede',
  'brand-2': '#caedda',
  'brand-3': '#c5d4c3',
  'brand-4': '#b1a3b7',
  'brand-5': '#91868e',
}

RGB Array

[222, 222, 222], [202, 237, 218], [197, 212, 195], [177, 163, 183], [145, 134, 142]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #DEDEDE, #CAEDDA, #C5D4C3, #B1A3B7, #91868E 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: #dedede; --color-2: #caedda; --color-3: #c5d4c3; --color-4: #b1a3b7; --color-5: #91868e. 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 cool-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