← Back to Editor

#F7EAE1 · #D6D9CE · #86A5A0 · #5E4F56 · #D2A1A5

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

#F7EAE1

Apricot · Linen · Peach Orange

HEX
#F7EAE1
RGB
rgb(247, 234, 225)
HSL
hsl(25, 58%, 93%)
HSB
hsb(25, 9%, 97%)
CMYK
cmyk(0%, 5%, 9%, 3%)
Oklch
oklch(94.5% 0.019 57.2)

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

#D6D9CE

Willow Green · LightGray · Mint Green

HEX
#D6D9CE
RGB
rgb(214, 217, 206)
HSL
hsl(76, 13%, 83%)
HSB
hsb(76, 5%, 85%)
CMYK
cmyk(1%, 0%, 5%, 15%)
Oklch
oklch(88.0% 0.015 119.1)

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

#86A5A0

Mineral Blue · DarkSeaGreen · Lake Green

HEX
#86A5A0
RGB
rgb(134, 165, 160)
HSL
hsl(170, 15%, 59%)
HSB
hsb(170, 19%, 65%)
CMYK
cmyk(19%, 0%, 3%, 35%)
Oklch
oklch(69.7% 0.035 184.5)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#5E4F56

Dark Violet · DimGray · Charcoal

HEX
#5E4F56
RGB
rgb(94, 79, 86)
HSL
hsl(332, 9%, 34%)
HSB
hsb(332, 16%, 37%)
CMYK
cmyk(0%, 16%, 9%, 63%)
Oklch
oklch(44.5% 0.023 348.2)

Traditional「Dark Violet」· Paint「Charcoal」· Creative Midnight Shadow

#D2A1A5

Peach Pink · Tan · Coral Red

HEX
#D2A1A5
RGB
rgb(210, 161, 165)
HSL
hsl(355, 35%, 73%)
HSB
hsb(355, 23%, 82%)
CMYK
cmyk(0%, 23%, 21%, 18%)
Oklch
oklch(75.5% 0.058 13.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F7EAE1
E3EFF8

Analogous

F8E3E5
F7EAE1
F8F6E3

Triadic

F7EAE1
E3F8EB
EBE3F8

Split-Comp.

F7EAE1
E3F8F6
E3E5F8

Tetradic

F7EAE1
E5F8E3
E3EFF8
F6E3F8

Contrast Matrix WCAG 2.1 Contrast

F7EAE1
D6D9CE
86A5A0
5E4F56
D2A1A5
—
1.2
Fail
2.3
Fail
6.5
AA
1.9
Fail
1.2
Fail
—
1.9
Fail
5.4
AA
1.6
Fail
2.3
Fail
1.9
Fail
—
2.9
Fail
1.2
Fail
6.5
AA
5.4
AA
2.9
Fail
—
3.4
AA Large
1.9
Fail
1.6
Fail
1.2
Fail
3.4
AA Large
—
White BG
1.2Fail
1.4Fail
2.7Fail
7.7AAA
2.2Fail
Black BG
17.8AAA
14.7AAA
7.9AAA
2.7Fail
9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F1F1E3
D7D7D1
9394A1
585754
BDBCA4

Deuteranopia

F2F3E4
D7D7D1
928FA2
585A54
C0C3A4

Tritanopia

F6E5E5
D6D3D3
88A2A2
5D5353
D0A3A3

Achromatopsia

EDEDED
D7D7D7
9B9B9B
545454
B0B0B0

Shades & Tints Shades & Tints

#F7EAE1

Dark
Light

#D6D9CE

Dark
Light

#86A5A0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f7eae1;
  --color-2: #d6d9ce;
  --color-3: #86a5a0;
  --color-4: #5e4f56;
  --color-5: #d2a1a5;
}

SCSS

$color-1: #f7eae1;
$color-2: #d6d9ce;
$color-3: #86a5a0;
$color-4: #5e4f56;
$color-5: #d2a1a5;

TAILWIND

colors: {
  'brand-1': '#f7eae1',
  'brand-2': '#d6d9ce',
  'brand-3': '#86a5a0',
  'brand-4': '#5e4f56',
  'brand-5': '#d2a1a5',
}

RGB Array

[247, 234, 225], [214, 217, 206], [134, 165, 160], [94, 79, 86], [210, 161, 165]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #F7EAE1, #D6D9CE, #86A5A0, #5E4F56, #D2A1A5 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: #f7eae1; --color-2: #d6d9ce; --color-3: #86a5a0; --color-4: #5e4f56; --color-5: #d2a1a5. 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