← Back to Editor

#5C4F6A · #9A9584 · #D8DA9D · #C0B69E · #A8929E

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

#5C4F6A

Deep Indigo · DimGray · Eggplant

HEX
#5C4F6A
RGB
rgb(92, 79, 106)
HSL
hsl(269, 15%, 36%)
HSB
hsb(269, 25%, 42%)
CMYK
cmyk(13%, 25%, 0%, 58%)
Oklch
oklch(45.1% 0.046 306.5)

TraditionalDeep Indigo」· PaintEggplant」· Creative Blush Sunrise

#9A9584

Ginger · Gray · Sunflower

HEX
#9A9584
RGB
rgb(154, 149, 132)
HSL
hsl(46, 10%, 56%)
HSB
hsb(46, 14%, 60%)
CMYK
cmyk(0%, 3%, 14%, 40%)
Oklch
oklch(66.9% 0.025 93.4)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

#D8DA9D

Fresh Green · Khaki · Sunflower

HEX
#D8DA9D
RGB
rgb(216, 218, 157)
HSL
hsl(62, 45%, 74%)
HSB
hsb(62, 28%, 85%)
CMYK
cmyk(1%, 0%, 28%, 15%)
Oklch
oklch(87.2% 0.079 109.5)

TraditionalFresh Green」· PaintSunflower」· Creative Lemon Fizz

#C0B69E

Ginger · Tan · Sunflower

HEX
#C0B69E
RGB
rgb(192, 182, 158)
HSL
hsl(42, 21%, 69%)
HSB
hsb(42, 18%, 75%)
CMYK
cmyk(0%, 5%, 18%, 25%)
Oklch
oklch(77.8% 0.035 88.1)

TraditionalGinger」· PaintSunflower」· Creative Lemon Fizz

#A8929E

Mauve · DarkGray · Rose Pink

HEX
#A8929E
RGB
rgb(168, 146, 158)
HSL
hsl(327, 11%, 62%)
HSB
hsb(327, 13%, 66%)
CMYK
cmyk(0%, 13%, 6%, 34%)
Oklch
oklch(68.3% 0.031 343.9)

TraditionalMauve」· PaintRose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5C4F6A
5C6A4E

Analogous

4E4E6A
5C4F6A
694E6A

Triadic

5C4F6A
6A5B4E
4E6A5B

Split-Comp.

5C4F6A
6A694E
4E6A4E

Tetradic

5C4F6A
6A4E4E
5C6A4E
4E6A69

Contrast Matrix WCAG 2.1 Contrast

5C4F6A
9A9584
D8DA9D
C0B69E
A8929E
2.5
Fail
5.2
AA
3.7
AA Large
2.6
Fail
2.5
Fail
2.1
Fail
1.5
Fail
1.0
Fail
5.2
AA
2.1
Fail
1.4
Fail
2.0
Fail
3.7
AA Large
1.5
Fail
1.4
Fail
1.4
Fail
2.6
Fail
1.0
Fail
2.0
Fail
1.4
Fail
White BG
7.5AAA
3.0Fail
1.5Fail
2.0Fail
2.9Fail
Black BG
2.8Fail
7.0AAA
14.4AAA
10.4AAA
7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

565663
989888
D9D9AC
BCBCA4
9E9E9B

Deuteranopia

575862
989989
D9D9AF
BCBDA5
A0A19A

Tritanopia

5B5E5D
9A8B8C
D8B7BA
BFA8A9
A79998

Achromatopsia

565656
959595
D2D2D2
B6B6B6
9A9A9A

Shades & Tints Shades & Tints

#5C4F6A

Dark
Light

#9A9584

Dark
Light

#D8DA9D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5c4f6a;
  --color-2: #9a9584;
  --color-3: #d8da9d;
  --color-4: #c0b69e;
  --color-5: #a8929e;
}

SCSS

$color-1: #5c4f6a;
$color-2: #9a9584;
$color-3: #d8da9d;
$color-4: #c0b69e;
$color-5: #a8929e;

TAILWIND

colors: {
  'brand-1': '#5c4f6a',
  'brand-2': '#9a9584',
  'brand-3': '#d8da9d',
  'brand-4': '#c0b69e',
  'brand-5': '#a8929e',
}

RGB Array

[92, 79, 106], [154, 149, 132], [216, 218, 157], [192, 182, 158], [168, 146, 158]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #5C4F6A, #9A9584, #D8DA9D, #C0B69E, #A8929E is ideal for: brand design, premium product pages, magazine layouts. 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: #5c4f6a; --color-2: #9a9584; --color-3: #d8da9d; --color-4: #c0b69e; --color-5: #a8929e. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 tech, SaaS, healthcare, eco 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