← Back to Editor

#C4D59E · #EEF0C8 · #D9D1F6 · #D1758C · #C33C5D

nature

A 5-color nature palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#C4D59E

Willow Green · Tan · Apple Green

HEX
#C4D59E
RGB
rgb(196, 213, 158)
HSL
hsl(79, 40%, 73%)
HSB
hsb(79, 26%, 84%)
CMYK
cmyk(8%, 0%, 26%, 16%)
Oklch
oklch(84.6% 0.076 122.0)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#EEF0C8

Fresh Green · Bisque · Lemon Cream

HEX
#EEF0C8
RGB
rgb(238, 240, 200)
HSL
hsl(63, 57%, 86%)
HSB
hsb(63, 17%, 94%)
CMYK
cmyk(1%, 0%, 17%, 6%)
Oklch
oklch(94.3% 0.052 109.7)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#D9D1F6

Wisteria · Lavender · Sky Blue

HEX
#D9D1F6
RGB
rgb(217, 209, 246)
HSL
hsl(253, 67%, 89%)
HSB
hsb(253, 15%, 96%)
CMYK
cmyk(12%, 15%, 0%, 4%)
Oklch
oklch(87.9% 0.051 295.2)

TraditionalWisteria」· PaintSky Blue」· Creative Lavender Dream

#D1758C

Peach Pink · LightCoral · Coral Red

HEX
#D1758C
RGB
rgb(209, 117, 140)
HSL
hsl(345, 50%, 64%)
HSB
hsb(345, 44%, 82%)
CMYK
cmyk(0%, 44%, 33%, 18%)
Oklch
oklch(67.1% 0.117 4.7)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

#C33C5D

Crimson · MediumVioletRed · Passion Red

HEX
#C33C5D
RGB
rgb(195, 60, 93)
HSL
hsl(345, 53%, 50%)
HSB
hsb(345, 69%, 76%)
CMYK
cmyk(0%, 69%, 52%, 24%)
Oklch
oklch(56.1% 0.172 10.1)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C4D59E
B09FD6

Analogous

D6CC9F
C4D59E
A9D69F

Triadic

C4D59E
9FC4D6
D69FC4

Split-Comp.

C4D59E
9FA9D6
CC9FD6

Tetradic

C4D59E
9FD6CC
B09FD6
D69FA9

Contrast Matrix WCAG 2.1 Contrast

C4D59E
EEF0C8
D9D1F6
D1758C
C33C5D
1.3
Fail
1.1
Fail
2.0
Fail
3.2
AA Large
1.3
Fail
1.2
Fail
2.7
Fail
4.3
AA Large
1.1
Fail
1.2
Fail
2.2
Fail
3.5
AA Large
2.0
Fail
2.7
Fail
2.2
Fail
1.6
Fail
3.2
AA Large
4.3
AA Large
3.5
AA Large
1.6
Fail
White BG
1.6Fail
1.2Fail
1.5Fail
3.2AA Large
5.1AA
Black BG
13.4AAA
17.9AAA
14.4AAA
6.6AA
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCCAB
EFEFD2
D6D5ED
A9A886
898755

Deuteranopia

CAC9AF
EFEFD4
D6D7EB
AFB585
909B53

Tritanopia

C5B6B8
EED9DB
D9E6E4
CC8281
BC4F4D

Achromatopsia

CACACA
EBEBEB
D8D8D8
939393
686868

Shades & Tints Shades & Tints

#C4D59E

Dark
Light

#EEF0C8

Dark
Light

#D9D1F6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c4d59e;
  --color-2: #eef0c8;
  --color-3: #d9d1f6;
  --color-4: #d1758c;
  --color-5: #c33c5d;
}

SCSS

$color-1: #c4d59e;
$color-2: #eef0c8;
$color-3: #d9d1f6;
$color-4: #d1758c;
$color-5: #c33c5d;

TAILWIND

colors: {
  'brand-1': '#c4d59e',
  'brand-2': '#eef0c8',
  'brand-3': '#d9d1f6',
  'brand-4': '#d1758c',
  'brand-5': '#c33c5d',
}

RGB Array

[196, 213, 158], [238, 240, 200], [217, 209, 246], [209, 117, 140], [195, 60, 93]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #C4D59E, #EEF0C8, #D9D1F6, #D1758C, #C33C5D 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: #c4d59e; --color-2: #eef0c8; --color-3: #d9d1f6; --color-4: #d1758c; --color-5: #c33c5d. 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