← Back to Editor

#D8E4D6 · #F8F4E9 · #E6E3D0 · #E3EFC0 · #73636A

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

WorkspaceReadingData Visualization

Color Details Color Details

#D8E4D6

Celadon · LightGray · Mint Green

HEX
#D8E4D6
RGB
rgb(216, 228, 214)
HSL
hsl(111, 21%, 87%)
HSB
hsb(111, 6%, 89%)
CMYK
cmyk(5%, 0%, 6%, 11%)
Oklch
oklch(90.6% 0.023 141.2)

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

#F8F4E9

Goose Yellow · Linen · Lemon Cream

HEX
#F8F4E9
RGB
rgb(248, 244, 233)
HSL
hsl(44, 52%, 94%)
HSB
hsb(44, 6%, 97%)
CMYK
cmyk(0%, 2%, 6%, 3%)
Oklch
oklch(96.7% 0.015 90.2)

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

#E6E3D0

Fresh Green · LightGray · Lemon Cream

HEX
#E6E3D0
RGB
rgb(230, 227, 208)
HSL
hsl(52, 31%, 86%)
HSB
hsb(52, 10%, 90%)
CMYK
cmyk(0%, 1%, 10%, 10%)
Oklch
oklch(91.3% 0.026 99.6)

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

#E3EFC0

Willow Green · Wheat · Mint Green

HEX
#E3EFC0
RGB
rgb(227, 239, 192)
HSL
hsl(75, 59%, 85%)
HSB
hsb(75, 20%, 94%)
CMYK
cmyk(5%, 0%, 20%, 6%)
Oklch
oklch(93.1% 0.063 119.3)

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

#73636A

Ink Gray · DimGray · Warm Gray

HEX
#73636A
RGB
rgb(115, 99, 106)
HSL
hsl(334, 7%, 42%)
HSB
hsb(334, 14%, 45%)
CMYK
cmyk(0%, 14%, 8%, 55%)
Oklch
oklch(51.7% 0.023 349.7)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8E4D6
E3D7E5

Analogous

E0E5D7
D8E4D6
D7E5DC

Triadic

D8E4D6
D7D9E5
E5D7D9

Split-Comp.

D8E4D6
DCD7E5
E5D7E0

Tetradic

D8E4D6
D7E0E5
E3D7E5
E5DCD7

Contrast Matrix WCAG 2.1 Contrast

D8E4D6
F8F4E9
E6E3D0
E3EFC0
73636A
—
1.2
Fail
1.0
Fail
1.1
Fail
4.3
AA Large
1.2
Fail
—
1.2
Fail
1.1
Fail
5.1
AA
1.0
Fail
1.2
Fail
—
1.1
Fail
4.4
AA Large
1.1
Fail
1.1
Fail
1.1
Fail
—
4.7
AA
4.3
AA Large
5.1
AA
4.4
AA Large
4.7
AA
—
White BG
1.3Fail
1.1Fail
1.3Fail
1.2Fail
5.6AA
Black BG
16.0AAA
19.1AAA
16.3AAA
17.4AAA
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDD9
F6F6EC
E5E5D5
E8E8CB
6C6C68

Deuteranopia

DDDCDA
F7F7EC
E5E5D6
E8E7CE
6D6E68

Tritanopia

D9DCDD
F8EEEE
E6D8D9
E4D4D6
726767

Achromatopsia

DFDFDF
F4F4F4
E2E2E2
E6E6E6
696969

Shades & Tints Shades & Tints

#D8E4D6

Dark
Light

#F8F4E9

Dark
Light

#E6E3D0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8e4d6;
  --color-2: #f8f4e9;
  --color-3: #e6e3d0;
  --color-4: #e3efc0;
  --color-5: #73636a;
}

SCSS

$color-1: #d8e4d6;
$color-2: #f8f4e9;
$color-3: #e6e3d0;
$color-4: #e3efc0;
$color-5: #73636a;

TAILWIND

colors: {
  'brand-1': '#d8e4d6',
  'brand-2': '#f8f4e9',
  'brand-3': '#e6e3d0',
  'brand-4': '#e3efc0',
  'brand-5': '#73636a',
}

RGB Array

[216, 228, 214], [248, 244, 233], [230, 227, 208], [227, 239, 192], [115, 99, 106]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D8E4D6, #F8F4E9, #E6E3D0, #E3EFC0, #73636A is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d8e4d6; --color-2: #f8f4e9; --color-3: #e6e3d0; --color-4: #e3efc0; --color-5: #73636a. 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. 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. 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