#C7D1AD + #FCF8A7 + #D1E599 + #81E6BB + #47A389 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C7D1AD

Willow Green · Silver · Apple Green

HEX

#C7D1AD

RGB

rgb(199, 209, 173)

HSL

hsl(77, 28%, 75%)

HSB

hsb(77, 17%, 82%)

CMYK

cmyk(5%, 0%, 17%, 18%)

Oklch

oklch(84.4% 0.050 120.1)

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

#FCF8A7

Fresh Green · Wheat · Lemon Cream

HEX

#FCF8A7

RGB

rgb(252, 248, 167)

HSL

hsl(57, 93%, 82%)

HSB

hsb(57, 34%, 99%)

CMYK

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

Oklch

oklch(96.4% 0.101 105.7)

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

#D1E599

Willow Green · Khaki · Apple Green

HEX

#D1E599

RGB

rgb(209, 229, 153)

HSL

hsl(76, 59%, 75%)

HSB

hsb(76, 33%, 90%)

CMYK

cmyk(9%, 0%, 33%, 10%)

Oklch

oklch(88.9% 0.101 120.5)

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

#81E6BB

Jade · MediumAquaMarine · Apple Green

HEX

#81E6BB

RGB

rgb(129, 230, 187)

HSL

hsl(154, 67%, 70%)

HSB

hsb(154, 44%, 90%)

CMYK

cmyk(44%, 0%, 19%, 10%)

Oklch

oklch(85.1% 0.114 164.5)

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

#47A389

Mineral Blue · MediumSeaGreen · Mint Ice

HEX

#47A389

RGB

rgb(71, 163, 137)

HSL

hsl(163, 39%, 46%)

HSB

hsb(163, 56%, 64%)

CMYK

cmyk(56%, 0%, 16%, 36%)

Oklch

oklch(65.2% 0.097 171.9)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C7D1AD

B8ADD1

Analogous

D1C9AD

C7D1AD

B5D1AD

Triadic

C7D1AD

ADC7D1

D1ADC7

Split-Comp.

C7D1AD

ADB5D1

C9ADD1

Tetradic

C7D1AD

ADD1C9

B8ADD1

D1ADB5

Contrast Matrix WCAG 2.1 Contrast

C7D1AD	FCF8A7	D1E599	81E6BB	47A389
—	1.5 Fail	1.2 Fail	1.1 Fail	1.9 Fail
1.5 Fail	—	1.2 Fail	1.4 Fail	2.8 Fail
1.2 Fail	1.2 Fail	—	1.1 Fail	2.2 Fail
1.1 Fail	1.4 Fail	1.1 Fail	—	2.0 Fail
1.9 Fail	2.8 Fail	2.2 Fail	2.0 Fail	—

White BG

1.6Fail

1.1Fail

1.4Fail

1.5Fail

3.1AA Large

Black BG

13.2AAA

19.1AAA

15.4AAA

14.0AAA

6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCBB6

FAFABB

DADAAB

ADAEC5

6F708F

Deuteranopia

CBCAB8

FBFBBF

D9D7B0

A79FC8

6A6391

Tritanopia

C7BDBE

FCCACD

D2BABD

86CECF

4C9495

Achromatopsia

CACACA

F0F0F0

D6D6D6

C3C3C3

858585

Shades & Tints Shades & Tints

#C7D1AD

Dark

Light

#FCF8A7

Dark

Light

#D1E599

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c7d1ad;
  --color-2: #fcf8a7;
  --color-3: #d1e599;
  --color-4: #81e6bb;
  --color-5: #47a389;
}

SCSS

$color-1: #c7d1ad;
$color-2: #fcf8a7;
$color-3: #d1e599;
$color-4: #81e6bb;
$color-5: #47a389;

TAILWIND

colors: {
  'brand-1': '#c7d1ad',
  'brand-2': '#fcf8a7',
  'brand-3': '#d1e599',
  'brand-4': '#81e6bb',
  'brand-5': '#47a389',
}

RGB Array

[199, 209, 173], [252, 248, 167], [209, 229, 153], [129, 230, 187], [71, 163, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C7D1AD, #FCF8A7, #D1E599, #81E6BB, #47A389 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: #c7d1ad; --color-2: #fcf8a7; --color-3: #d1e599; --color-4: #81e6bb; --color-5: #47a389. 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