← Back to Editor

#D4D56C · #9EAD57 · #E8E8E8 · #AEBFCC · #D3DFE7

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D4D56C

Fresh Green · BurlyWood · Sunflower

HEX
#D4D56C
RGB
rgb(212, 213, 108)
HSL
hsl(61, 56%, 63%)
HSB
hsb(61, 49%, 84%)
CMYK
cmyk(0%, 0%, 49%, 16%)
Oklch
oklch(85.1% 0.128 109.3)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#9EAD57

Grass Green · DarkSeaGreen · Olive Green

HEX
#9EAD57
RGB
rgb(158, 173, 87)
HSL
hsl(70, 34%, 51%)
HSB
hsb(70, 50%, 68%)
CMYK
cmyk(9%, 0%, 50%, 32%)
Oklch
oklch(71.7% 0.113 117.5)

TraditionalGrass Green」· PaintOlive Green」· Creative Blush Sunrise

#E8E8E8

Plain White · Lavender · Cloud White

HEX
#E8E8E8
RGB
rgb(232, 232, 232)
HSL
hsl(0, 0%, 91%)
HSB
hsb(0, 0%, 91%)
CMYK
cmyk(0%, 0%, 0%, 9%)
Oklch
oklch(93.1% 0.000 89.9)

TraditionalPlain White」· PaintCloud White」· Creative Morning Mist

#AEBFCC

Sky Blue · LightSteelBlue · Cobalt Blue

HEX
#AEBFCC
RGB
rgb(174, 191, 204)
HSL
hsl(206, 23%, 74%)
HSB
hsb(206, 15%, 80%)
CMYK
cmyk(15%, 6%, 0%, 20%)
Oklch
oklch(79.6% 0.026 240.7)

TraditionalSky Blue」· PaintCobalt Blue」· Creative Twilight Haze

#D3DFE7

Sky Blue · LightGray · Sky Blue

HEX
#D3DFE7
RGB
rgb(211, 223, 231)
HSL
hsl(204, 29%, 87%)
HSB
hsb(204, 9%, 91%)
CMYK
cmyk(9%, 3%, 0%, 9%)
Oklch
oklch(89.7% 0.017 236.7)

TraditionalSky Blue」· PaintSky Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4D56C
6E6CD5

Analogous

D5A26C
D4D56C
9FD56C

Triadic

D4D56C
6CD4D5
D56CD4

Split-Comp.

D4D56C
6C9FD5
A26CD5

Tetradic

D4D56C
6CD5A2
6E6CD5
D56C9F

Contrast Matrix WCAG 2.1 Contrast

D4D56C
9EAD57
E8E8E8
AEBFCC
D3DFE7
1.6
Fail
1.3
Fail
1.2
Fail
1.1
Fail
1.6
Fail
2.0
Fail
1.3
Fail
1.8
Fail
1.3
Fail
2.0
Fail
1.5
Fail
1.1
Fail
1.2
Fail
1.3
Fail
1.5
Fail
1.4
Fail
1.1
Fail
1.8
Fail
1.1
Fail
1.4
Fail
White BG
1.6Fail
2.5Fail
1.2Fail
1.9Fail
1.4Fail
Black BG
13.5AAA
8.6AAA
17.1AAA
11.1AAA
15.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D4D485
A4A56C
E8E8E8
B5B6C9
D8D8E5

Deuteranopia

D4D48C
A4A371
E8E8E8
B4B3C8
D8D7E5

Tritanopia

D4999E
9F7C80
E8E8E8
AFC6C6
D4E4E3

Achromatopsia

C9C9C9
9F9F9F
E8E8E8
BBBBBB
DCDCDC

Shades & Tints Shades & Tints

#D4D56C

Dark
Light

#9EAD57

Dark
Light

#E8E8E8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4d56c;
  --color-2: #9ead57;
  --color-3: #e8e8e8;
  --color-4: #aebfcc;
  --color-5: #d3dfe7;
}

SCSS

$color-1: #d4d56c;
$color-2: #9ead57;
$color-3: #e8e8e8;
$color-4: #aebfcc;
$color-5: #d3dfe7;

TAILWIND

colors: {
  'brand-1': '#d4d56c',
  'brand-2': '#9ead57',
  'brand-3': '#e8e8e8',
  'brand-4': '#aebfcc',
  'brand-5': '#d3dfe7',
}

RGB Array

[212, 213, 108], [158, 173, 87], [232, 232, 232], [174, 191, 204], [211, 223, 231]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4D56C, #9EAD57, #E8E8E8, #AEBFCC, #D3DFE7 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: #d4d56c; --color-2: #9ead57; --color-3: #e8e8e8; --color-4: #aebfcc; --color-5: #d3dfe7. 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 general-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