← Back to Editor

#DCDDB3 · #B6B795 · #96B5A3 · #5E8C8A · #4F7675

cool

A 5-color cool 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

#DCDDB3

Fresh Green · Wheat · Lemon Cream

HEX
#DCDDB3
RGB
rgb(220, 221, 179)
HSL
hsl(61, 38%, 78%)
HSB
hsb(61, 19%, 87%)
CMYK
cmyk(0%, 0%, 19%, 13%)
Oklch
oklch(88.6% 0.056 108.6)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#B6B795

Fresh Green · DarkGray · Sunflower

HEX
#B6B795
RGB
rgb(182, 183, 149)
HSL
hsl(62, 19%, 65%)
HSB
hsb(62, 19%, 72%)
CMYK
cmyk(1%, 0%, 19%, 28%)
Oklch
oklch(77.0% 0.047 108.8)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#96B5A3

Celadon · DarkSeaGreen · Apple Green

HEX
#96B5A3
RGB
rgb(150, 181, 163)
HSL
hsl(145, 17%, 65%)
HSB
hsb(145, 17%, 71%)
CMYK
cmyk(17%, 0%, 10%, 29%)
Oklch
oklch(74.5% 0.043 159.7)

TraditionalCeladon」· PaintApple Green」· Creative Mint Breeze

#5E8C8A

Mineral Blue · SlateGray · Mint Ice

HEX
#5E8C8A
RGB
rgb(94, 140, 138)
HSL
hsl(177, 20%, 46%)
HSB
hsb(177, 33%, 55%)
CMYK
cmyk(33%, 0%, 1%, 45%)
Oklch
oklch(60.6% 0.050 192.5)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#4F7675

Mineral Blue · DimGray · Mint Ice

HEX
#4F7675
RGB
rgb(79, 118, 117)
HSL
hsl(178, 20%, 39%)
HSB
hsb(178, 33%, 46%)
CMYK
cmyk(33%, 0%, 1%, 54%)
Oklch
oklch(53.7% 0.044 193.9)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DCDDB3
B2B2DC

Analogous

DCC8B2
DCDDB3
C6DCB2

Triadic

DCDDB3
B2DCDC
DCB2DC

Split-Comp.

DCDDB3
B2C6DC
C8B2DC

Tetradic

DCDDB3
B2DCC8
B2B2DC
DCB2C6

Contrast Matrix WCAG 2.1 Contrast

DCDDB3
B6B795
96B5A3
5E8C8A
4F7675
1.5
Fail
1.6
Fail
2.7
Fail
3.6
AA Large
1.5
Fail
1.1
Fail
1.8
Fail
2.4
Fail
1.6
Fail
1.1
Fail
1.7
Fail
2.3
Fail
2.7
Fail
1.8
Fail
1.7
Fail
1.3
Fail
3.6
AA Large
2.4
Fail
2.3
Fail
1.3
Fail
White BG
1.4Fail
2.1Fail
2.2Fail
3.8AA Large
5.0AA
Black BG
15.0AAA
10.2AAA
9.4AAA
5.6AA
4.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DCDCBD
B6B69D
A3A4A7
72728A
606075

Deuteranopia

DCDCC0
B6B69F
A29FA8
6F6C8B
5E5B75

Tritanopia

DCC5C7
B6A4A5
98ABAC
608B8B
517575

Achromatopsia

D8D8D8
B3B3B3
AAAAAA
7E7E7E
6A6A6A

Shades & Tints Shades & Tints

#DCDDB3

Dark
Light

#B6B795

Dark
Light

#96B5A3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dcddb3;
  --color-2: #b6b795;
  --color-3: #96b5a3;
  --color-4: #5e8c8a;
  --color-5: #4f7675;
}

SCSS

$color-1: #dcddb3;
$color-2: #b6b795;
$color-3: #96b5a3;
$color-4: #5e8c8a;
$color-5: #4f7675;

TAILWIND

colors: {
  'brand-1': '#dcddb3',
  'brand-2': '#b6b795',
  'brand-3': '#96b5a3',
  'brand-4': '#5e8c8a',
  'brand-5': '#4f7675',
}

RGB Array

[220, 221, 179], [182, 183, 149], [150, 181, 163], [94, 140, 138], [79, 118, 117]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #DCDDB3, #B6B795, #96B5A3, #5E8C8A, #4F7675 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: #dcddb3; --color-2: #b6b795; --color-3: #96b5a3; --color-4: #5e8c8a; --color-5: #4f7675. 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 cool-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