← Back to Editor

#D7E9DE · #E9F2EA · #F4F9F7 · #DBD8B4 · #F3F2F1

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

#D7E9DE

Celadon · LightGray · Mint Green

HEX
#D7E9DE
RGB
rgb(215, 233, 222)
HSL
hsl(143, 29%, 88%)
HSB
hsb(143, 8%, 91%)
CMYK
cmyk(8%, 0%, 5%, 9%)
Oklch
oklch(91.8% 0.024 159.1)

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

#E9F2EA

Celadon · Linen · Mint Green

HEX
#E9F2EA
RGB
rgb(233, 242, 234)
HSL
hsl(127, 26%, 93%)
HSB
hsb(127, 4%, 95%)
CMYK
cmyk(4%, 0%, 3%, 5%)
Oklch
oklch(95.2% 0.014 148.8)

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

#F4F9F7

Jade · Snow · Mint Green

HEX
#F4F9F7
RGB
rgb(244, 249, 247)
HSL
hsl(156, 29%, 97%)
HSB
hsb(156, 2%, 98%)
CMYK
cmyk(2%, 0%, 1%, 2%)
Oklch
oklch(97.8% 0.006 170.4)

Traditional「Jade」· Paint「Mint Green」· Creative Arctic Pool

#DBD8B4

Fresh Green · Wheat · Lemon Cream

HEX
#DBD8B4
RGB
rgb(219, 216, 180)
HSL
hsl(55, 35%, 78%)
HSB
hsb(55, 18%, 86%)
CMYK
cmyk(0%, 1%, 18%, 14%)
Oklch
oklch(87.5% 0.048 103.4)

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

#F3F2F1

Goose Yellow · SeaShell · Cloud White

HEX
#F3F2F1
RGB
rgb(243, 242, 241)
HSL
hsl(30, 8%, 95%)
HSB
hsb(30, 1%, 95%)
CMYK
cmyk(0%, 0%, 1%, 5%)
Oklch
oklch(96.2% 0.002 67.8)

Traditional「Goose Yellow」· Paint「Cloud White」· Creative Morning Mist

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D7E9DE
E9D8E2

Analogous

DAE9D8
D7E9DE
D8E9E7

Triadic

D7E9DE
DED8E9
E9DED8

Split-Comp.

D7E9DE
E7D8E9
E9D8DA

Tetradic

D7E9DE
D8DAE9
E9D8E2
E9E7D8

Contrast Matrix WCAG 2.1 Contrast

D7E9DE
E9F2EA
F4F9F7
DBD8B4
F3F2F1
—
1.1
Fail
1.2
Fail
1.1
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
1.3
Fail
1.0
Fail
1.2
Fail
1.1
Fail
—
1.4
Fail
1.1
Fail
1.1
Fail
1.3
Fail
1.4
Fail
—
1.3
Fail
1.1
Fail
1.0
Fail
1.1
Fail
1.3
Fail
—
White BG
1.3Fail
1.1Fail
1.1Fail
1.4Fail
1.1Fail
Black BG
16.6AAA
18.4AAA
19.7AAA
14.5AAA
18.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDFE1
EDEDEC
F6F6F7
DADABD
F3F3F1

Deuteranopia

DEDCE1
ECECEC
F6F6F8
DADABF
F3F3F1

Tritanopia

D8E3E3
E9EDEE
F4F8F8
DBC4C5
F3F1F1

Achromatopsia

E2E2E2
EEEEEE
F7F7F7
D5D5D5
F2F2F2

Shades & Tints Shades & Tints

#D7E9DE

Dark
Light

#E9F2EA

Dark
Light

#F4F9F7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d7e9de;
  --color-2: #e9f2ea;
  --color-3: #f4f9f7;
  --color-4: #dbd8b4;
  --color-5: #f3f2f1;
}

SCSS

$color-1: #d7e9de;
$color-2: #e9f2ea;
$color-3: #f4f9f7;
$color-4: #dbd8b4;
$color-5: #f3f2f1;

TAILWIND

colors: {
  'brand-1': '#d7e9de',
  'brand-2': '#e9f2ea',
  'brand-3': '#f4f9f7',
  'brand-4': '#dbd8b4',
  'brand-5': '#f3f2f1',
}

RGB Array

[215, 233, 222], [233, 242, 234], [244, 249, 247], [219, 216, 180], [243, 242, 241]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D7E9DE, #E9F2EA, #F4F9F7, #DBD8B4, #F3F2F1 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: #d7e9de; --color-2: #e9f2ea; --color-3: #f4f9f7; --color-4: #dbd8b4; --color-5: #f3f2f1. 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