← Back to Editor

#AB6879 · #B97A8C · #BAB4A8 · #D0D6BA · #CEE6D3

nature

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedWarm

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#AB6879

Crimson · Gray · Passion Red

HEX
#AB6879
RGB
rgb(171, 104, 121)
HSL
hsl(345, 29%, 54%)
HSB
hsb(345, 39%, 67%)
CMYK
cmyk(0%, 39%, 29%, 33%)
Oklch
oklch(59.5% 0.088 3.7)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#B97A8C

Dark Violet · LightCoral · Rose Pink

HEX
#B97A8C
RGB
rgb(185, 122, 140)
HSL
hsl(343, 31%, 60%)
HSB
hsb(343, 34%, 73%)
CMYK
cmyk(0%, 34%, 24%, 27%)
Oklch
oklch(65.0% 0.082 1.0)

TraditionalDark Violet」· PaintRose Pink」· Creative Blush Sunrise

#BAB4A8

Ginger · DarkGray · Sunflower

HEX
#BAB4A8
RGB
rgb(186, 180, 168)
HSL
hsl(40, 12%, 69%)
HSB
hsb(40, 10%, 73%)
CMYK
cmyk(0%, 3%, 10%, 27%)
Oklch
oklch(77.1% 0.018 84.6)

TraditionalGinger」· PaintSunflower」· Creative Lemon Fizz

#D0D6BA

Willow Green · LightGray · Apple Green

HEX
#D0D6BA
RGB
rgb(208, 214, 186)
HSL
hsl(73, 25%, 78%)
HSB
hsb(73, 13%, 84%)
CMYK
cmyk(3%, 0%, 13%, 16%)
Oklch
oklch(86.4% 0.038 117.0)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#CEE6D3

Celadon · LightGray · Mint Green

HEX
#CEE6D3
RGB
rgb(206, 230, 211)
HSL
hsl(132, 32%, 85%)
HSB
hsb(132, 10%, 90%)
CMYK
cmyk(10%, 0%, 8%, 10%)
Oklch
oklch(90.2% 0.036 151.7)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AB6879
68AC9B

Analogous

AC689B
AB6879
AC7968

Triadic

AB6879
79AC68
6879AC

Split-Comp.

AB6879
68AC79
689BAC

Tetradic

AB6879
9BAC68
68AC9B
7968AC

Contrast Matrix WCAG 2.1 Contrast

AB6879
B97A8C
BAB4A8
D0D6BA
CEE6D3
1.2
Fail
2.0
Fail
2.8
Fail
3.2
AA Large
1.2
Fail
1.6
Fail
2.3
Fail
2.6
Fail
2.0
Fail
1.6
Fail
1.4
Fail
1.6
Fail
2.8
Fail
2.3
Fail
1.4
Fail
1.1
Fail
3.2
AA Large
2.6
Fail
1.6
Fail
1.1
Fail
White BG
4.2AA Large
3.4AA Large
2.1Fail
1.5Fail
1.3Fail
Black BG
5.0AA
6.2AA
10.2AAA
14.0AAA
15.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8E8D75
9E9D88
B7B7AB
D3D3C1
D8D9D8

Deuteranopia

929774
A1A687
B8B8AC
D2D2C2
D7D5D9

Tritanopia

A87271
B68483
BAADAE
D0C6C7
CFDBDC

Achromatopsia

7E7E7E
8F8F8F
B4B4B4
D1D1D1
DDDDDD

Shades & Tints Shades & Tints

#AB6879

Dark
Light

#B97A8C

Dark
Light

#BAB4A8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ab6879;
  --color-2: #b97a8c;
  --color-3: #bab4a8;
  --color-4: #d0d6ba;
  --color-5: #cee6d3;
}

SCSS

$color-1: #ab6879;
$color-2: #b97a8c;
$color-3: #bab4a8;
$color-4: #d0d6ba;
$color-5: #cee6d3;

TAILWIND

colors: {
  'brand-1': '#ab6879',
  'brand-2': '#b97a8c',
  'brand-3': '#bab4a8',
  'brand-4': '#d0d6ba',
  'brand-5': '#cee6d3',
}

RGB Array

[171, 104, 121], [185, 122, 140], [186, 180, 168], [208, 214, 186], [206, 230, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #AB6879, #B97A8C, #BAB4A8, #D0D6BA, #CEE6D3 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: #ab6879; --color-2: #b97a8c; --color-3: #bab4a8; --color-4: #d0d6ba; --color-5: #cee6d3. 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