← Back to Editor

#D5E9E6 · #D8EDCC · #D8E68A · #DEE094 · #FE8F02

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

#D5E9E6

Jade · Lavender · Glacier Blue

HEX
#D5E9E6
RGB
rgb(213, 233, 230)
HSL
hsl(171, 31%, 87%)
HSB
hsb(171, 9%, 91%)
CMYK
cmyk(9%, 0%, 1%, 9%)
Oklch
oklch(91.8% 0.022 186.0)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#D8EDCC

Celadon · LightGray · Mint Green

HEX
#D8EDCC
RGB
rgb(216, 237, 204)
HSL
hsl(98, 48%, 86%)
HSB
hsb(98, 14%, 93%)
CMYK
cmyk(9%, 0%, 14%, 7%)
Oklch
oklch(92.2% 0.049 134.1)

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

#D8E68A

Fresh Green · Khaki · Sunflower

HEX
#D8E68A
RGB
rgb(216, 230, 138)
HSL
hsl(69, 65%, 72%)
HSB
hsb(69, 40%, 90%)
CMYK
cmyk(6%, 0%, 40%, 10%)
Oklch
oklch(89.4% 0.117 115.9)

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

#DEE094

Fresh Green · Khaki · Sunflower

HEX
#DEE094
RGB
rgb(222, 224, 148)
HSL
hsl(62, 55%, 73%)
HSB
hsb(62, 34%, 88%)
CMYK
cmyk(1%, 0%, 34%, 12%)
Oklch
oklch(88.8% 0.097 109.5)

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

#FE8F02

Ochre · Orange · Amber Brown

HEX
#FE8F02
RGB
rgb(254, 143, 2)
HSL
hsl(34, 99%, 50%)
HSB
hsb(34, 99%, 100%)
CMYK
cmyk(0%, 44%, 99%, 0%)
Oklch
oklch(75.4% 0.177 59.9)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5E9E6
E8D4D7

Analogous

D4E8DB
D5E9E6
D4E1E8

Triadic

D5E9E6
E5D4E8
E8E5D4

Split-Comp.

D5E9E6
E8D4E1
E8DBD4

Tetradic

D5E9E6
DBD4E8
E8D4D7
E1E8D4

Contrast Matrix WCAG 2.1 Contrast

D5E9E6
D8EDCC
D8E68A
DEE094
FE8F02
—
1.0
Fail
1.1
Fail
1.1
Fail
1.8
Fail
1.0
Fail
—
1.1
Fail
1.1
Fail
1.8
Fail
1.1
Fail
1.1
Fail
—
1.0
Fail
1.7
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
1.7
Fail
1.8
Fail
1.8
Fail
1.7
Fail
1.7
Fail
—
White BG
1.3Fail
1.2Fail
1.3Fail
1.4Fail
2.3Fail
Black BG
16.6AAA
16.9AAA
15.6AAA
15.2AAA
9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDEE7
E1E1D4
DEDEA0
DFDFA6
CECD24

Deuteranopia

DDDBE7
E0DED6
DDDCA6
DFDFAB
D4DD2C

Tritanopia

D6E7E7
D9DADC
D9B2B6
DEB5B8
F83F45

Achromatopsia

E3E3E3
E3E3E3
D7D7D7
D7D7D7
A0A0A0

Shades & Tints Shades & Tints

#D5E9E6

Dark
Light

#D8EDCC

Dark
Light

#D8E68A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5e9e6;
  --color-2: #d8edcc;
  --color-3: #d8e68a;
  --color-4: #dee094;
  --color-5: #fe8f02;
}

SCSS

$color-1: #d5e9e6;
$color-2: #d8edcc;
$color-3: #d8e68a;
$color-4: #dee094;
$color-5: #fe8f02;

TAILWIND

colors: {
  'brand-1': '#d5e9e6',
  'brand-2': '#d8edcc',
  'brand-3': '#d8e68a',
  'brand-4': '#dee094',
  'brand-5': '#fe8f02',
}

RGB Array

[213, 233, 230], [216, 237, 204], [216, 230, 138], [222, 224, 148], [254, 143, 2]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D5E9E6, #D8EDCC, #D8E68A, #DEE094, #FE8F02 is ideal for: health products, baby brands, fresh-style blogs. 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: #d5e9e6; --color-2: #d8edcc; --color-3: #d8e68a; --color-4: #dee094; --color-5: #fe8f02. 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 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