#FCCFB7 + #EBD7C9 + #DFDFDB + #CADEE1 + #40F91A · nature - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarmCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#FCCFB7

Apricot · Wheat · Peach Orange

HEX

#FCCFB7

RGB

rgb(252, 207, 183)

HSL

hsl(21, 92%, 85%)

HSB

hsb(21, 27%, 99%)

CMYK

cmyk(0%, 18%, 27%, 1%)

Oklch

oklch(88.7% 0.060 49.6)

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

#EBD7C9

Apricot · Bisque · Peach Orange

HEX

#EBD7C9

RGB

rgb(235, 215, 201)

HSL

hsl(25, 46%, 85%)

HSB

hsb(25, 14%, 92%)

CMYK

cmyk(0%, 9%, 14%, 8%)

Oklch

oklch(89.2% 0.029 57.3)

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

#DFDFDB

Plain White · LightGray · Cloud White

HEX

#DFDFDB

RGB

rgb(223, 223, 219)

HSL

hsl(60, 6%, 87%)

HSB

hsb(60, 2%, 87%)

CMYK

cmyk(0%, 0%, 2%, 13%)

Oklch

oklch(90.3% 0.005 106.5)

Traditional「Plain White」· Paint「Cloud White」· Creative Silver Lining

#CADEE1

Sky Blue · LightGray · Glacier Blue

HEX

#CADEE1

RGB

rgb(202, 222, 225)

HSL

hsl(188, 28%, 84%)

HSB

hsb(188, 10%, 88%)

CMYK

cmyk(10%, 1%, 0%, 12%)

Oklch

oklch(88.7% 0.022 207.6)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#40F91A

Emerald · LimeGreen · Olive Green

HEX

#40F91A

RGB

rgb(64, 249, 26)

HSL

hsl(110, 95%, 54%)

HSB

hsb(110, 90%, 98%)

CMYK

cmyk(74%, 0%, 90%, 2%)

Oklch

oklch(85.7% 0.278 141.3)

Traditional「Emerald」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCCFB7

B6E3FC

Analogous

FCB6C0

FCCFB7

FCF1B6

Triadic

FCCFB7

B6FCCE

CEB6FC

Split-Comp.

FCCFB7

B6FCF1

B6C0FC

Tetradic

FCCFB7

C0FCB6

B6E3FC

F1B6FC

Contrast Matrix WCAG 2.1 Contrast

FCCFB7	EBD7C9	DFDFDB	CADEE1	40F91A
—	1.0 Fail	1.1 Fail	1.0 Fail	1.0 Fail
1.0 Fail	—	1.0 Fail	1.0 Fail	1.0 Fail
1.1 Fail	1.0 Fail	—	1.0 Fail	1.1 Fail
1.0 Fail	1.0 Fail	1.0 Fail	—	1.0 Fail
1.0 Fail	1.0 Fail	1.1 Fail	1.0 Fail	—

White BG

1.4Fail

1.3Fail

1.4Fail

Black BG

14.7AAA

15.1AAA

15.7AAA

15.0AAA

14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E8BD

E2E2CC

DFDFDC

D3D3E0

909250

Deuteranopia

EBEEBE

E4E5CD

DFDFDC

D2D0E0

85785D

Tritanopia

FAC1C2

EACFD0

DFDDDD

CBE0E0

497B84

Achromatopsia

DADADA

DBDBDB

DFDFDF

D8D8D8

A8A8A8

Shades & Tints Shades & Tints

#FCCFB7

Dark

Light

#EBD7C9

Dark

Light

#DFDFDB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fccfb7;
  --color-2: #ebd7c9;
  --color-3: #dfdfdb;
  --color-4: #cadee1;
  --color-5: #40f91a;
}

SCSS

$color-1: #fccfb7;
$color-2: #ebd7c9;
$color-3: #dfdfdb;
$color-4: #cadee1;
$color-5: #40f91a;

TAILWIND

colors: {
  'brand-1': '#fccfb7',
  'brand-2': '#ebd7c9',
  'brand-3': '#dfdfdb',
  'brand-4': '#cadee1',
  'brand-5': '#40f91a',
}

RGB Array

[252, 207, 183], [235, 215, 201], [223, 223, 219], [202, 222, 225], [64, 249, 26]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #FCCFB7, #EBD7C9, #DFDFDB, #CADEE1, #40F91A 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: #fccfb7; --color-2: #ebd7c9; --color-3: #dfdfdb; --color-4: #cadee1; --color-5: #40f91a. 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