← Back to Editor

#A8A6A1 · #ABB1B8 · #D0D5D4 · #F4EBEB · #DDCFBB

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

#A8A6A1

Ash · DarkGray · Silver Sand

HEX
#A8A6A1
RGB
rgb(168, 166, 161)
HSL
hsl(43, 4%, 65%)
HSB
hsb(43, 4%, 66%)
CMYK
cmyk(0%, 1%, 4%, 34%)
Oklch
oklch(72.5% 0.007 88.7)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#ABB1B8

Azure · DarkGray · Silver Sand

HEX
#ABB1B8
RGB
rgb(171, 177, 184)
HSL
hsl(212, 8%, 70%)
HSB
hsb(212, 7%, 72%)
CMYK
cmyk(7%, 4%, 0%, 28%)
Oklch
oklch(75.8% 0.012 252.1)

TraditionalAzure」· PaintSilver Sand」· Creative Urban Concrete

#D0D5D4

Silver Gray · LightGray · Pearl Gray

HEX
#D0D5D4
RGB
rgb(208, 213, 212)
HSL
hsl(168, 6%, 83%)
HSB
hsb(168, 2%, 84%)
CMYK
cmyk(2%, 0%, 0%, 16%)
Oklch
oklch(86.9% 0.006 183.0)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

#F4EBEB

Peach Pink · Linen · Cherry Blossom

HEX
#F4EBEB
RGB
rgb(244, 235, 235)
HSL
hsl(0, 29%, 94%)
HSB
hsb(0, 4%, 96%)
CMYK
cmyk(0%, 4%, 4%, 4%)
Oklch
oklch(94.7% 0.010 17.3)

TraditionalPeach Pink」· PaintCherry Blossom」· Creative Blush Sunrise

#DDCFBB

Goose Yellow · LightGray · Peach Orange

HEX
#DDCFBB
RGB
rgb(221, 207, 187)
HSL
hsl(35, 33%, 80%)
HSB
hsb(35, 15%, 87%)
CMYK
cmyk(0%, 6%, 15%, 13%)
Oklch
oklch(86.1% 0.031 76.9)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A8A6A1
A2A4A9

Analogous

A9A4A2
A8A6A1
A8A9A2

Triadic

A8A6A1
A2A9A7
A7A2A9

Split-Comp.

A8A6A1
A2A8A9
A4A2A9

Tetradic

A8A6A1
A2A9A4
A2A4A9
A9A2A8

Contrast Matrix WCAG 2.1 Contrast

A8A6A1
ABB1B8
D0D5D4
F4EBEB
DDCFBB
1.1
Fail
1.6
Fail
2.1
Fail
1.6
Fail
1.1
Fail
1.5
Fail
1.8
Fail
1.4
Fail
1.6
Fail
1.5
Fail
1.3
Fail
1.0
Fail
2.1
Fail
1.8
Fail
1.3
Fail
1.3
Fail
1.6
Fail
1.4
Fail
1.0
Fail
1.3
Fail
White BG
2.4Fail
2.2Fail
1.5Fail
1.2Fail
1.5Fail
Black BG
8.6AAA
9.7AAA
14.2AAA
17.9AAA
13.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A7A2
AEAEB6
D2D2D4
F0F0EB
D7D7C0

Deuteranopia

A7A7A3
ADADB6
D2D2D4
F1F1EB
D8D9C1

Tritanopia

A8A3A3
ABB5B5
D0D4D4
F4EBEB
DCC4C5

Achromatopsia

A6A6A6
B0B0B0
D3D3D3
EEEEEE
D1D1D1

Shades & Tints Shades & Tints

#A8A6A1

Dark
Light

#ABB1B8

Dark
Light

#D0D5D4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a8a6a1;
  --color-2: #abb1b8;
  --color-3: #d0d5d4;
  --color-4: #f4ebeb;
  --color-5: #ddcfbb;
}

SCSS

$color-1: #a8a6a1;
$color-2: #abb1b8;
$color-3: #d0d5d4;
$color-4: #f4ebeb;
$color-5: #ddcfbb;

TAILWIND

colors: {
  'brand-1': '#a8a6a1',
  'brand-2': '#abb1b8',
  'brand-3': '#d0d5d4',
  'brand-4': '#f4ebeb',
  'brand-5': '#ddcfbb',
}

RGB Array

[168, 166, 161], [171, 177, 184], [208, 213, 212], [244, 235, 235], [221, 207, 187]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #A8A6A1, #ABB1B8, #D0D5D4, #F4EBEB, #DDCFBB is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. 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: #a8a6a1; --color-2: #abb1b8; --color-3: #d0d5d4; --color-4: #f4ebeb; --color-5: #ddcfbb. 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 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