#C9D7C4 + #E3F983 + #E9EAD9 + #F2EBE1 + #F1DED4 · neon - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

FuturisticEnergeticRebelliousWarm

Industry INDUSTRY

GamingWeb3 / CryptoDeep Tech

UI Context UI CONTEXT

Dark Mode UIDashboardCampaign Page

Color Details Color Details

#C9D7C4

Celadon · LightGray · Mint Green

HEX

#C9D7C4

RGB

rgb(201, 215, 196)

HSL

hsl(104, 19%, 81%)

HSB

hsb(104, 9%, 84%)

CMYK

cmyk(7%, 0%, 9%, 16%)

Oklch

oklch(86.3% 0.030 137.4)

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

#E3F983

Willow Green · Khaki · Apple Green

HEX

#E3F983

RGB

rgb(227, 249, 131)

HSL

hsl(71, 91%, 75%)

HSB

hsb(71, 47%, 98%)

CMYK

cmyk(9%, 0%, 47%, 2%)

Oklch

oklch(94.2% 0.145 118.0)

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

#E9EAD9

Fresh Green · Beige · Lemon Cream

HEX

#E9EAD9

RGB

rgb(233, 234, 217)

HSL

hsl(64, 29%, 88%)

HSB

hsb(64, 7%, 92%)

CMYK

cmyk(0%, 0%, 7%, 8%)

Oklch

oklch(93.2% 0.023 109.6)

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

#F2EBE1

Goose Yellow · Linen · Peach Orange

HEX

#F2EBE1

RGB

rgb(242, 235, 225)

HSL

hsl(35, 40%, 92%)

HSB

hsb(35, 7%, 95%)

CMYK

cmyk(0%, 3%, 7%, 5%)

Oklch

oklch(94.3% 0.015 77.1)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#F1DED4

Apricot · Bisque · Peach Orange

HEX

#F1DED4

RGB

rgb(241, 222, 212)

HSL

hsl(21, 51%, 89%)

HSB

hsb(21, 12%, 95%)

CMYK

cmyk(0%, 8%, 12%, 5%)

Oklch

oklch(91.3% 0.025 49.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C9D7C4

D3C5D8

Analogous

D3D8C5

C9D7C4

C5D8CA

Triadic

C9D7C4

C5CAD8

D8C5CA

Split-Comp.

C9D7C4

CAC5D8

D8C5D3

Tetradic

C9D7C4

C5D3D8

D3C5D8

D8CAC5

Contrast Matrix WCAG 2.1 Contrast

C9D7C4	E3F983	E9EAD9	F2EBE1	F1DED4
—	1.3 Fail	1.2 Fail	1.3 Fail	1.2 Fail
1.3 Fail	—	1.1 Fail	1.0 Fail	1.1 Fail
1.2 Fail	1.1 Fail	—	1.0 Fail	1.1 Fail
1.3 Fail	1.0 Fail	1.0 Fail	—	1.1 Fail
1.2 Fail	1.1 Fail	1.1 Fail	1.1 Fail	—

White BG

1.5Fail

1.2Fail

1.3Fail

Black BG

14.0AAA

18.1AAA

17.2AAA

17.7AAA

16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCFC9

EDEDA0

E9E9DD

EFEFE3

E9E9D6

Deuteranopia

CECDCA

EBEAA6

E9E9DE

EFF0E4

EAEBD7

Tritanopia

CACCCD

E4B6BB

E9E0E1

F2E5E6

F0D8D9

Achromatopsia

D1D1D1

E5E5E5

E8E8E8

ECECEC

E3E3E3

Shades & Tints Shades & Tints

#C9D7C4

Dark

Light

#E3F983

Dark

Light

#E9EAD9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c9d7c4;
  --color-2: #e3f983;
  --color-3: #e9ead9;
  --color-4: #f2ebe1;
  --color-5: #f1ded4;
}

SCSS

$color-1: #c9d7c4;
$color-2: #e3f983;
$color-3: #e9ead9;
$color-4: #f2ebe1;
$color-5: #f1ded4;

TAILWIND

colors: {
  'brand-1': '#c9d7c4',
  'brand-2': '#e3f983',
  'brand-3': '#e9ead9',
  'brand-4': '#f2ebe1',
  'brand-5': '#f1ded4',
}

RGB Array

[201, 215, 196], [227, 249, 131], [233, 234, 217], [242, 235, 225], [241, 222, 212]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This neon-style palette of #C9D7C4, #E3F983, #E9EAD9, #F2EBE1, #F1DED4 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: #c9d7c4; --color-2: #e3f983; --color-3: #e9ead9; --color-4: #f2ebe1; --color-5: #f1ded4. 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 neon-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