← Back to Editor

#D8E3D9 · #F2EFE9 · #E3E0D3 · #C8C297 · #A1ADA7

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

#D8E3D9

Celadon · LightGray · Mint Green

HEX
#D8E3D9
RGB
rgb(216, 227, 217)
HSL
hsl(125, 16%, 87%)
HSB
hsb(125, 5%, 89%)
CMYK
cmyk(5%, 0%, 4%, 11%)
Oklch
oklch(90.5% 0.018 148.1)

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

#F2EFE9

Goose Yellow · Linen · Lemon Cream

HEX
#F2EFE9
RGB
rgb(242, 239, 233)
HSL
hsl(40, 26%, 93%)
HSB
hsb(40, 4%, 95%)
CMYK
cmyk(0%, 1%, 4%, 5%)
Oklch
oklch(95.3% 0.009 84.6)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#E3E0D3

Goose Yellow · LightGray · Lemon Cream

HEX
#E3E0D3
RGB
rgb(227, 224, 211)
HSL
hsl(49, 22%, 86%)
HSB
hsb(49, 7%, 89%)
CMYK
cmyk(0%, 1%, 7%, 11%)
Oklch
oklch(90.5% 0.018 96.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#C8C297

Fresh Green · Tan · Sunflower

HEX
#C8C297
RGB
rgb(200, 194, 151)
HSL
hsl(53, 31%, 69%)
HSB
hsb(53, 25%, 78%)
CMYK
cmyk(0%, 3%, 25%, 22%)
Oklch
oklch(80.8% 0.058 100.9)

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

#A1ADA7

Ash · DarkGray · Silver Sand

HEX
#A1ADA7
RGB
rgb(161, 173, 167)
HSL
hsl(150, 7%, 65%)
HSB
hsb(150, 7%, 68%)
CMYK
cmyk(7%, 0%, 3%, 32%)
Oklch
oklch(73.6% 0.016 164.6)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8E3D9
E3D9E2

Analogous

DDE3D9
D8E3D9
D9E3DF

Triadic

D8E3D9
D9D9E3
E3D9D9

Split-Comp.

D8E3D9
DFD9E3
E3D9DD

Tetradic

D8E3D9
D9DDE3
E3D9E2
E3DFD9

Contrast Matrix WCAG 2.1 Contrast

D8E3D9
F2EFE9
E3E0D3
C8C297
A1ADA7
—
1.2
Fail
1.0
Fail
1.4
Fail
1.8
Fail
1.2
Fail
—
1.2
Fail
1.6
Fail
2.0
Fail
1.0
Fail
1.2
Fail
—
1.4
Fail
1.8
Fail
1.4
Fail
1.6
Fail
1.4
Fail
—
1.3
Fail
1.8
Fail
2.0
Fail
1.8
Fail
1.3
Fail
—
White BG
1.3Fail
1.1Fail
1.3Fail
1.8Fail
2.3Fail
Black BG
15.9AAA
18.3AAA
15.9AAA
11.6AAA
9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDDB
F1F1EA
E2E2D6
C5C5A1
A6A6A8

Deuteranopia

DCDBDC
F1F1EB
E2E2D7
C6C6A4
A6A5A9

Tritanopia

D9DDDE
F2ECEC
E3D9D9
C8AAAB
A2AAAA

Achromatopsia

DFDFDF
EFEFEF
DFDFDF
BFBFBF
A9A9A9

Shades & Tints Shades & Tints

#D8E3D9

Dark
Light

#F2EFE9

Dark
Light

#E3E0D3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8e3d9;
  --color-2: #f2efe9;
  --color-3: #e3e0d3;
  --color-4: #c8c297;
  --color-5: #a1ada7;
}

SCSS

$color-1: #d8e3d9;
$color-2: #f2efe9;
$color-3: #e3e0d3;
$color-4: #c8c297;
$color-5: #a1ada7;

TAILWIND

colors: {
  'brand-1': '#d8e3d9',
  'brand-2': '#f2efe9',
  'brand-3': '#e3e0d3',
  'brand-4': '#c8c297',
  'brand-5': '#a1ada7',
}

RGB Array

[216, 227, 217], [242, 239, 233], [227, 224, 211], [200, 194, 151], [161, 173, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D8E3D9, #F2EFE9, #E3E0D3, #C8C297, #A1ADA7 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: #d8e3d9; --color-2: #f2efe9; --color-3: #e3e0d3; --color-4: #c8c297; --color-5: #a1ada7. 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