← Back to Editor

#9D666C · #B27769 · #CF9A8A · #D9BCAE · #D1CDCE

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

#9D666C

Crimson · Gray · Passion Red

HEX
#9D666C
RGB
rgb(157, 102, 108)
HSL
hsl(353, 22%, 51%)
HSB
hsb(353, 35%, 62%)
CMYK
cmyk(0%, 35%, 31%, 38%)
Oklch
oklch(57.1% 0.071 12.4)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#B27769

Crimson · Gray · Passion Red

HEX
#B27769
RGB
rgb(178, 119, 105)
HSL
hsl(12, 32%, 55%)
HSB
hsb(12, 41%, 70%)
CMYK
cmyk(0%, 33%, 41%, 30%)
Oklch
oklch(62.7% 0.078 33.9)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#CF9A8A

Peach Pink · Tan · Coral Red

HEX
#CF9A8A
RGB
rgb(207, 154, 138)
HSL
hsl(14, 42%, 68%)
HSB
hsb(14, 33%, 81%)
CMYK
cmyk(0%, 26%, 33%, 19%)
Oklch
oklch(73.2% 0.068 37.5)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#D9BCAE

Apricot · Silver · Peach Orange

HEX
#D9BCAE
RGB
rgb(217, 188, 174)
HSL
hsl(20, 36%, 77%)
HSB
hsb(20, 20%, 85%)
CMYK
cmyk(0%, 13%, 20%, 15%)
Oklch
oklch(81.6% 0.039 47.4)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

#D1CDCE

Silver Gray · LightGray · Pearl Gray

HEX
#D1CDCE
RGB
rgb(209, 205, 206)
HSL
hsl(345, 4%, 81%)
HSB
hsb(345, 2%, 82%)
CMYK
cmyk(0%, 2%, 1%, 18%)
Oklch
oklch(85.2% 0.005 0.0)

TraditionalSilver Gray」· PaintPearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9D666C
679E97

Analogous

9E6788
9D666C
9E7C67

Triadic

9D666C
6D9E67
676D9E

Split-Comp.

9D666C
679E7C
67889E

Tetradic

9D666C
889E67
679E97
7C679E

Contrast Matrix WCAG 2.1 Contrast

9D666C
B27769
CF9A8A
D9BCAE
D1CDCE
1.3
Fail
1.9
Fail
2.6
Fail
2.9
Fail
1.3
Fail
1.5
Fail
2.0
Fail
2.3
Fail
1.9
Fail
1.5
Fail
1.4
Fail
1.5
Fail
2.6
Fail
2.0
Fail
1.4
Fail
1.1
Fail
2.9
Fail
2.3
Fail
1.5
Fail
1.1
Fail
White BG
4.6AA
3.7AA Large
2.4Fail
1.8Fail
1.6Fail
Black BG
4.6AA
5.7AA
8.6AAA
11.8AAA
13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

85856B
98986C
B8B88E
CCCCB1
CFCFCE

Deuteranopia

888D6A
9CA06D
BBBF8F
CED0B2
D0D0CE

Tritanopia

9A6969
AF6F70
CC9192
D8B4B5
D1CECE

Achromatopsia

777777
878787
A8A8A8
C3C3C3
CECECE

Shades & Tints Shades & Tints

#9D666C

Dark
Light

#B27769

Dark
Light

#CF9A8A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9d666c;
  --color-2: #b27769;
  --color-3: #cf9a8a;
  --color-4: #d9bcae;
  --color-5: #d1cdce;
}

SCSS

$color-1: #9d666c;
$color-2: #b27769;
$color-3: #cf9a8a;
$color-4: #d9bcae;
$color-5: #d1cdce;

TAILWIND

colors: {
  'brand-1': '#9d666c',
  'brand-2': '#b27769',
  'brand-3': '#cf9a8a',
  'brand-4': '#d9bcae',
  'brand-5': '#d1cdce',
}

RGB Array

[157, 102, 108], [178, 119, 105], [207, 154, 138], [217, 188, 174], [209, 205, 206]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #9D666C, #B27769, #CF9A8A, #D9BCAE, #D1CDCE 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: #9d666c; --color-2: #b27769; --color-3: #cf9a8a; --color-4: #d9bcae; --color-5: #d1cdce. 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