#CFF79E + #D5D09E + #DCA49E + #E7609E + #9B7CB6 · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#CFF79E

Willow Green · Khaki · Apple Green

HEX

#CFF79E

RGB

rgb(207, 247, 158)

HSL

hsl(87, 85%, 79%)

HSB

hsb(87, 36%, 97%)

CMYK

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

Oklch

oklch(92.7% 0.122 128.3)

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

#D5D09E

Fresh Green · Tan · Sunflower

HEX

#D5D09E

RGB

rgb(213, 208, 158)

HSL

hsl(55, 40%, 73%)

HSB

hsb(55, 26%, 84%)

CMYK

cmyk(0%, 2%, 26%, 16%)

Oklch

oklch(84.9% 0.066 102.9)

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

#DCA49E

Peach Pink · Tan · Coral Red

HEX

#DCA49E

RGB

rgb(220, 164, 158)

HSL

hsl(6, 47%, 74%)

HSB

hsb(6, 28%, 86%)

CMYK

cmyk(0%, 25%, 28%, 14%)

Oklch

oklch(76.9% 0.067 25.7)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#E7609E

Rouge · LightCoral · Rose Pink

HEX

#E7609E

RGB

rgb(231, 96, 158)

HSL

hsl(332, 74%, 64%)

HSB

hsb(332, 58%, 91%)

CMYK

cmyk(0%, 58%, 32%, 9%)

Oklch

oklch(67.6% 0.178 354.3)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#9B7CB6

Dark Plum · LightSlateGray · Violet

HEX

#9B7CB6

RGB

rgb(155, 124, 182)

HSL

hsl(272, 28%, 60%)

HSB

hsb(272, 32%, 71%)

CMYK

cmyk(15%, 32%, 0%, 29%)

Oklch

oklch(63.7% 0.091 308.4)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CFF79E

C59CF7

Analogous

F7F29C

CFF79E

A0F79C

Triadic

CFF79E

9CCEF7

F79CCE

Split-Comp.

CFF79E

9CA0F7

F29CF7

Tetradic

CFF79E

9CF7F2

C59CF7

F79CA0

Contrast Matrix WCAG 2.1 Contrast

CFF79E	D5D09E	DCA49E	E7609E	9B7CB6
—	1.3 Fail	1.8 Fail	2.7 Fail	2.9 Fail
1.3 Fail	—	1.4 Fail	2.0 Fail	2.2 Fail
1.8 Fail	1.4 Fail	—	1.5 Fail	1.7 Fail
2.7 Fail	2.0 Fail	1.5 Fail	—	1.1 Fail
2.9 Fail	2.2 Fail	1.7 Fail	1.1 Fail	—

White BG

1.2Fail

1.6Fail

2.1Fail

3.2AA Large

3.5AA Large

Black BG

17.5AAA

13.3AAA

9.8AAA

6.6AA

6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E0E1B4

D3D3AA

C4C39F

ADAB8F

8E8DA8

Deuteranopia

DEDBB9

D3D4AD

C7CBA0

B4BF8B

8F92A5

Tritanopia

D1C5C8

D5B4B6

D9A1A1

E08381

999D9A

Achromatopsia

E1E1E1

CCCCCC

B4B4B4

8F8F8F

8C8C8C

Shades & Tints Shades & Tints

#CFF79E

Dark

Light

#D5D09E

Dark

Light

#DCA49E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cff79e;
  --color-2: #d5d09e;
  --color-3: #dca49e;
  --color-4: #e7609e;
  --color-5: #9b7cb6;
}

SCSS

$color-1: #cff79e;
$color-2: #d5d09e;
$color-3: #dca49e;
$color-4: #e7609e;
$color-5: #9b7cb6;

TAILWIND

colors: {
  'brand-1': '#cff79e',
  'brand-2': '#d5d09e',
  'brand-3': '#dca49e',
  'brand-4': '#e7609e',
  'brand-5': '#9b7cb6',
}

RGB Array

[207, 247, 158], [213, 208, 158], [220, 164, 158], [231, 96, 158], [155, 124, 182]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #CFF79E, #D5D09E, #DCA49E, #E7609E, #9B7CB6 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: #cff79e; --color-2: #d5d09e; --color-3: #dca49e; --color-4: #e7609e; --color-5: #9b7cb6. 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 nature-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