← Back to Editor

#CDE0CD · #F9F4D7 · #FFBB9A · #FFD7A4 · #FFECA8

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

VibrantFreshWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Landing PageMobile App

Color Details Color Details

#CDE0CD

Celadon · LightGray · Mint Green

HEX
#CDE0CD
RGB
rgb(205, 224, 205)
HSL
hsl(120, 23%, 84%)
HSB
hsb(120, 8%, 88%)
CMYK
cmyk(8%, 0%, 8%, 12%)
Oklch
oklch(88.7% 0.033 145.3)

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

#F9F4D7

Fresh Green · Beige · Lemon Cream

HEX
#F9F4D7
RGB
rgb(249, 244, 215)
HSL
hsl(51, 74%, 91%)
HSB
hsb(51, 14%, 98%)
CMYK
cmyk(0%, 2%, 14%, 2%)
Oklch
oklch(96.4% 0.038 99.0)

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

#FFBB9A

Apricot · BurlyWood · Peach Orange

HEX
#FFBB9A
RGB
rgb(255, 187, 154)
HSL
hsl(20, 100%, 80%)
HSB
hsb(20, 40%, 100%)
CMYK
cmyk(0%, 27%, 40%, 0%)
Oklch
oklch(84.7% 0.091 46.9)

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

#FFD7A4

Goose Yellow · Wheat · Peach Orange

HEX
#FFD7A4
RGB
rgb(255, 215, 164)
HSL
hsl(34, 100%, 82%)
HSB
hsb(34, 36%, 100%)
CMYK
cmyk(0%, 16%, 36%, 0%)
Oklch
oklch(90.1% 0.079 73.3)

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

#FFECA8

Goose Yellow · Wheat · Lemon Cream

HEX
#FFECA8
RGB
rgb(255, 236, 168)
HSL
hsl(47, 100%, 83%)
HSB
hsb(47, 34%, 100%)
CMYK
cmyk(0%, 7%, 34%, 0%)
Oklch
oklch(94.3% 0.088 94.4)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CDE0CD
E0CDE0

Analogous

D6E0CD
CDE0CD
CDE0D6

Triadic

CDE0CD
CDCDE0
E0CDCD

Split-Comp.

CDE0CD
D6CDE0
E0CDD6

Tetradic

CDE0CD
CDD6E0
E0CDE0
E0D6CD

Contrast Matrix WCAG 2.1 Contrast

CDE0CD
F9F4D7
FFBB9A
FFD7A4
FFECA8
—
1.3
Fail
1.2
Fail
1.0
Fail
1.2
Fail
1.3
Fail
—
1.5
Fail
1.2
Fail
1.1
Fail
1.2
Fail
1.5
Fail
—
1.2
Fail
1.4
Fail
1.0
Fail
1.2
Fail
1.2
Fail
—
1.1
Fail
1.2
Fail
1.1
Fail
1.4
Fail
1.1
Fail
—
White BG
1.4Fail
1.1Fail
1.6Fail
1.4Fail
1.2Fail
Black BG
15.1AAA
18.9AAA
12.8AAA
15.5AAA
17.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D5D5D2
F7F7DE
E2E1A2
EEEDB0
F7F7B8

Deuteranopia

D4D3D3
F7F8E0
E6EBA4
F0F3B3
F8F9BC

Tritanopia

CED5D6
F9E4E5
FCA8AA
FDBABC
FEC5C8

Achromatopsia

D8D8D8
F2F2F2
CCCCCC
DDDDDD
EAEAEA

Shades & Tints Shades & Tints

#CDE0CD

Dark
Light

#F9F4D7

Dark
Light

#FFBB9A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cde0cd;
  --color-2: #f9f4d7;
  --color-3: #ffbb9a;
  --color-4: #ffd7a4;
  --color-5: #ffeca8;
}

SCSS

$color-1: #cde0cd;
$color-2: #f9f4d7;
$color-3: #ffbb9a;
$color-4: #ffd7a4;
$color-5: #ffeca8;

TAILWIND

colors: {
  'brand-1': '#cde0cd',
  'brand-2': '#f9f4d7',
  'brand-3': '#ffbb9a',
  'brand-4': '#ffd7a4',
  'brand-5': '#ffeca8',
}

RGB Array

[205, 224, 205], [249, 244, 215], [255, 187, 154], [255, 215, 164], [255, 236, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #CDE0CD, #F9F4D7, #FFBB9A, #FFD7A4, #FFECA8 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #cde0cd; --color-2: #f9f4d7; --color-3: #ffbb9a; --color-4: #ffd7a4; --color-5: #ffeca8. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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