#DEE194 + #F4FFC0 + #D0D897 + #9C9473 + #E4F39E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DEE194

Fresh Green · Khaki · Sunflower

HEX

#DEE194

RGB

rgb(222, 225, 148)

HSL

hsl(62, 56%, 73%)

HSB

hsb(62, 34%, 88%)

CMYK

cmyk(1%, 0%, 34%, 12%)

Oklch

oklch(89.0% 0.098 110.1)

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

#F4FFC0

Willow Green · Bisque · Mint Green

HEX

#F4FFC0

RGB

rgb(244, 255, 192)

HSL

hsl(70, 100%, 88%)

HSB

hsb(70, 25%, 100%)

CMYK

cmyk(4%, 0%, 25%, 0%)

Oklch

oklch(97.7% 0.082 116.0)

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

#D0D897

Fresh Green · Khaki · Sunflower

HEX

#D0D897

RGB

rgb(208, 216, 151)

HSL

hsl(67, 45%, 72%)

HSB

hsb(67, 30%, 85%)

CMYK

cmyk(4%, 0%, 30%, 15%)

Oklch

oklch(86.1% 0.085 113.9)

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

#9C9473

Ginger · Gray · Sunflower

HEX

#9C9473

RGB

rgb(156, 148, 115)

HSL

hsl(48, 17%, 53%)

HSB

hsb(48, 26%, 61%)

CMYK

cmyk(0%, 5%, 26%, 39%)

Oklch

oklch(66.5% 0.047 96.0)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#E4F39E

Willow Green · Khaki · Apple Green

HEX

#E4F39E

RGB

rgb(228, 243, 158)

HSL

hsl(71, 78%, 79%)

HSB

hsb(71, 35%, 95%)

CMYK

cmyk(6%, 0%, 35%, 5%)

Oklch

oklch(93.4% 0.109 116.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DEE194

9694E1

Analogous

E1BD94

DEE194

B8E194

Triadic

DEE194

94DEE1

E194DE

Split-Comp.

DEE194

94B8E1

BD94E1

Tetradic

DEE194

94E1BD

9694E1

E194B8

Contrast Matrix WCAG 2.1 Contrast

DEE194	F4FFC0	D0D897	9C9473	E4F39E
—	1.3 Fail	1.1 Fail	2.2 Fail	1.2 Fail
1.3 Fail	—	1.4 Fail	2.9 Fail	1.1 Fail
1.1 Fail	1.4 Fail	—	2.0 Fail	1.3 Fail
2.2 Fail	2.9 Fail	2.0 Fail	—	2.6 Fail
1.2 Fail	1.1 Fail	1.3 Fail	2.6 Fail	—

White BG

1.4Fail

1.1Fail

1.5Fail

3.0AA Large

1.2Fail

Black BG

15.3AAA

19.9AAA

14.0AAA

6.9AA

17.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDFA7

F9F9CF

D3D4A7

99987B

EAEBB3

Deuteranopia

DFDFAB

F8F7D3

D3D2AB

999A7D

EAE9B8

Tritanopia

DEB5B9

F5DBDE

D0B3B6

9C8183

E5C3C6

Achromatopsia

D7D7D7

F5F5F5

CECECE

939393

E5E5E5

Shades & Tints Shades & Tints

#DEE194

Dark

Light

#F4FFC0

Dark

Light

#D0D897

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dee194;
  --color-2: #f4ffc0;
  --color-3: #d0d897;
  --color-4: #9c9473;
  --color-5: #e4f39e;
}

SCSS

$color-1: #dee194;
$color-2: #f4ffc0;
$color-3: #d0d897;
$color-4: #9c9473;
$color-5: #e4f39e;

TAILWIND

colors: {
  'brand-1': '#dee194',
  'brand-2': '#f4ffc0',
  'brand-3': '#d0d897',
  'brand-4': '#9c9473',
  'brand-5': '#e4f39e',
}

RGB Array

[222, 225, 148], [244, 255, 192], [208, 216, 151], [156, 148, 115], [228, 243, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DEE194, #F4FFC0, #D0D897, #9C9473, #E4F39E 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: #dee194; --color-2: #f4ffc0; --color-3: #d0d897; --color-4: #9c9473; --color-5: #e4f39e. 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