← Back to Editor

#F8EEDD · #D2DBE6 · #CCC2B2 · #AD90A7 · #425255

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 WebsiteBlogData Visualization

Color Details Color Details

#F8EEDD

Goose Yellow · Beige · Peach Orange

HEX
#F8EEDD
RGB
rgb(248, 238, 221)
HSL
hsl(38, 66%, 92%)
HSB
hsb(38, 11%, 97%)
CMYK
cmyk(0%, 4%, 11%, 3%)
Oklch
oklch(95.2% 0.025 81.1)

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

#D2DBE6

Azure · LightGray · Sky Blue

HEX
#D2DBE6
RGB
rgb(210, 219, 230)
HSL
hsl(213, 29%, 86%)
HSB
hsb(213, 9%, 90%)
CMYK
cmyk(9%, 5%, 0%, 10%)
Oklch
oklch(88.8% 0.018 253.3)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

#CCC2B2

Goose Yellow · Silver · Warm Sun

HEX
#CCC2B2
RGB
rgb(204, 194, 178)
HSL
hsl(37, 20%, 75%)
HSB
hsb(37, 13%, 80%)
CMYK
cmyk(0%, 5%, 13%, 20%)
Oklch
oklch(81.8% 0.025 79.7)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#AD90A7

Mauve · DarkGray · Lilac Purple

HEX
#AD90A7
RGB
rgb(173, 144, 167)
HSL
hsl(312, 15%, 62%)
HSB
hsb(312, 17%, 68%)
CMYK
cmyk(0%, 17%, 3%, 32%)
Oklch
oklch(68.7% 0.047 333.3)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#425255

Slate Blue · DarkSlateGray · Mint Ice

HEX
#425255
RGB
rgb(66, 82, 85)
HSL
hsl(189, 13%, 30%)
HSB
hsb(189, 22%, 33%)
CMYK
cmyk(22%, 4%, 0%, 67%)
Oklch
oklch(42.6% 0.021 210.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F8EEDD
DDE7F8

Analogous

F8E1DD
F8EEDD
F4F8DD

Triadic

F8EEDD
DDF8EE
EEDDF8

Split-Comp.

F8EEDD
DDF4F8
E1DDF8

Tetradic

F8EEDD
DDF8E1
DDE7F8
F8DDF4

Contrast Matrix WCAG 2.1 Contrast

F8EEDD
D2DBE6
CCC2B2
AD90A7
425255
—
1.2
Fail
1.5
Fail
2.5
Fail
7.1
AAA
1.2
Fail
—
1.3
Fail
2.1
Fail
5.8
AA
1.5
Fail
1.3
Fail
—
1.6
Fail
4.6
AA
2.5
Fail
2.1
Fail
1.6
Fail
—
2.9
Fail
7.1
AAA
5.8
AA
4.6
AA
2.9
Fail
—
White BG
1.1Fail
1.4Fail
1.8Fail
2.9Fail
8.2AAA
Black BG
18.3AAA
15.0AAA
11.9AAA
7.3AAA
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F4F4E1
D6D6E3
C8C8B6
A0A0A1
494954

Deuteranopia

F4F5E2
D5D5E3
C8C9B7
A2A4A0
484754

Tritanopia

F8E4E5
D2E1E1
CBB9BA
AC9D9C
435454

Achromatopsia

EFEFEF
DADADA
C3C3C3
9B9B9B
4E4E4E

Shades & Tints Shades & Tints

#F8EEDD

Dark
Light

#D2DBE6

Dark
Light

#CCC2B2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f8eedd;
  --color-2: #d2dbe6;
  --color-3: #ccc2b2;
  --color-4: #ad90a7;
  --color-5: #425255;
}

SCSS

$color-1: #f8eedd;
$color-2: #d2dbe6;
$color-3: #ccc2b2;
$color-4: #ad90a7;
$color-5: #425255;

TAILWIND

colors: {
  'brand-1': '#f8eedd',
  'brand-2': '#d2dbe6',
  'brand-3': '#ccc2b2',
  'brand-4': '#ad90a7',
  'brand-5': '#425255',
}

RGB Array

[248, 238, 221], [210, 219, 230], [204, 194, 178], [173, 144, 167], [66, 82, 85]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #F8EEDD, #D2DBE6, #CCC2B2, #AD90A7, #425255 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f8eedd; --color-2: #d2dbe6; --color-3: #ccc2b2; --color-4: #ad90a7; --color-5: #425255. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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