← Back to Editor

#D4DAB8 · #C8CCA9 · #ADB79F · #464F56 · #212A39

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 LibraryData Visualization

Color Details Color Details

#D4DAB8

Willow Green · LightGray · Apple Green

HEX
#D4DAB8
RGB
rgb(212, 218, 184)
HSL
hsl(71, 31%, 79%)
HSB
hsb(71, 16%, 85%)
CMYK
cmyk(3%, 0%, 16%, 15%)
Oklch
oklch(87.5% 0.046 115.5)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#C8CCA9

Fresh Green · Silver · Sunflower

HEX
#C8CCA9
RGB
rgb(200, 204, 169)
HSL
hsl(67, 26%, 73%)
HSB
hsb(67, 17%, 80%)
CMYK
cmyk(2%, 0%, 17%, 20%)
Oklch
oklch(83.3% 0.047 112.7)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#ADB79F

Willow Green · DarkGray · Apple Green

HEX
#ADB79F
RGB
rgb(173, 183, 159)
HSL
hsl(85, 14%, 67%)
HSB
hsb(85, 13%, 72%)
CMYK
cmyk(5%, 0%, 13%, 28%)
Oklch
oklch(76.5% 0.035 125.7)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#464F56

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#464F56
RGB
rgb(70, 79, 86)
HSL
hsl(206, 10%, 31%)
HSB
hsb(206, 19%, 34%)
CMYK
cmyk(19%, 8%, 0%, 66%)
Oklch
oklch(42.2% 0.016 241.3)

Traditional「Slate Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#212A39

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#212A39
RGB
rgb(33, 42, 57)
HSL
hsl(218, 27%, 18%)
HSB
hsb(218, 42%, 22%)
CMYK
cmyk(42%, 26%, 0%, 78%)
Oklch
oklch(28.3% 0.031 260.5)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4DAB8
BFB9DA

Analogous

DAD0B9
D4DAB8
C3DAB9

Triadic

D4DAB8
B9D4DA
DAB9D4

Split-Comp.

D4DAB8
B9C3DA
D0B9DA

Tetradic

D4DAB8
B9DAD0
BFB9DA
DAB9C3

Contrast Matrix WCAG 2.1 Contrast

D4DAB8
C8CCA9
ADB79F
464F56
212A39
—
1.1
Fail
1.4
Fail
5.8
AA
10.0
AAA
1.1
Fail
—
1.3
Fail
5.0
AA
8.7
AAA
1.4
Fail
1.3
Fail
—
4.0
AA Large
6.9
AA
5.8
AA
5.0
AA
4.0
AA Large
—
1.7
Fail
10.0
AAA
8.7
AAA
6.9
AA
1.7
Fail
—
White BG
1.4Fail
1.7Fail
2.1Fail
8.4AAA
14.4AAA
Black BG
14.5AAA
12.7AAA
10.1AAA
2.5Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D7D7C0
CACAB1
B1B1A5
4A4A54
252535

Deuteranopia

D6D6C2
CAC9B4
B1B0A6
494954
242435

Tritanopia

D4C7C8
C8B8BA
AEA9AA
465353
213332

Achromatopsia

D4D4D4
C7C7C7
B1B1B1
4D4D4D
292929

Shades & Tints Shades & Tints

#D4DAB8

Dark
Light

#C8CCA9

Dark
Light

#ADB79F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4dab8;
  --color-2: #c8cca9;
  --color-3: #adb79f;
  --color-4: #464f56;
  --color-5: #212a39;
}

SCSS

$color-1: #d4dab8;
$color-2: #c8cca9;
$color-3: #adb79f;
$color-4: #464f56;
$color-5: #212a39;

TAILWIND

colors: {
  'brand-1': '#d4dab8',
  'brand-2': '#c8cca9',
  'brand-3': '#adb79f',
  'brand-4': '#464f56',
  'brand-5': '#212a39',
}

RGB Array

[212, 218, 184], [200, 204, 169], [173, 183, 159], [70, 79, 86], [33, 42, 57]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4DAB8, #C8CCA9, #ADB79F, #464F56, #212A39 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: #d4dab8; --color-2: #c8cca9; --color-3: #adb79f; --color-4: #464f56; --color-5: #212a39. 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