← Back to Editor

#B59F88 · #D8BDA0 · #BF7F5B · #494A3C · #5F5C49

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 WebsiteBlogData Visualization

Color Details Color Details

#B59F88

Ginger · Tan · Warm Sun

HEX
#B59F88
RGB
rgb(181, 159, 136)
HSL
hsl(31, 23%, 62%)
HSB
hsb(31, 25%, 71%)
CMYK
cmyk(0%, 12%, 25%, 29%)
Oklch
oklch(71.6% 0.041 68.3)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#D8BDA0

Goose Yellow · Tan · Warm Sun

HEX
#D8BDA0
RGB
rgb(216, 189, 160)
HSL
hsl(31, 42%, 74%)
HSB
hsb(31, 26%, 85%)
CMYK
cmyk(0%, 12%, 26%, 15%)
Oklch
oklch(81.4% 0.050 69.0)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#BF7F5B

Tangerine · DarkSalmon · Warm Sun

HEX
#BF7F5B
RGB
rgb(191, 127, 91)
HSL
hsl(22, 44%, 55%)
HSB
hsb(22, 52%, 75%)
CMYK
cmyk(0%, 34%, 52%, 25%)
Oklch
oklch(65.4% 0.094 49.9)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#494A3C

Autumn Sage · DarkSlateGray · Honey Gold

HEX
#494A3C
RGB
rgb(73, 74, 60)
HSL
hsl(64, 10%, 26%)
HSB
hsb(64, 19%, 29%)
CMYK
cmyk(1%, 0%, 19%, 71%)
Oklch
oklch(40.4% 0.023 110.7)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#5F5C49

Autumn Sage · DarkOliveGreen · Honey Gold

HEX
#5F5C49
RGB
rgb(95, 92, 73)
HSL
hsl(52, 13%, 33%)
HSB
hsb(52, 23%, 37%)
CMYK
cmyk(0%, 3%, 23%, 63%)
Oklch
oklch(47.2% 0.030 100.0)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B59F88
889DB4

Analogous

B48988
B59F88
B4B488

Triadic

B59F88
88B49F
9F88B4

Split-Comp.

B59F88
88B4B4
8988B4

Tetradic

B59F88
88B489
889DB4
B488B4

Contrast Matrix WCAG 2.1 Contrast

B59F88
D8BDA0
BF7F5B
494A3C
5F5C49
—
1.4
Fail
1.3
Fail
3.6
AA Large
2.7
Fail
1.4
Fail
—
1.8
Fail
5.0
AA
3.8
AA Large
1.3
Fail
1.8
Fail
—
2.7
Fail
2.1
Fail
3.6
AA Large
5.0
AA
2.7
Fail
—
1.3
Fail
2.7
Fail
3.8
AA Large
2.1
Fail
1.3
Fail
—
White BG
2.5Fail
1.8Fail
3.3AA Large
9.0AAA
6.7AA
Black BG
8.3AAA
11.7AAA
6.4AA
2.3Fail
3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

ABAB8E
CCCCA7
A3A364
49493F
5E5E4E

Deuteranopia

ADAE8F
CED0A9
A7AC66
494940
5E5E4F

Tritanopia

B49293
D7ADAE
BC6B6C
494243
5F5152

Achromatopsia

A3A3A3
C2C2C2
8E8E8E
484848
5B5B5B

Shades & Tints Shades & Tints

#B59F88

Dark
Light

#D8BDA0

Dark
Light

#BF7F5B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b59f88;
  --color-2: #d8bda0;
  --color-3: #bf7f5b;
  --color-4: #494a3c;
  --color-5: #5f5c49;
}

SCSS

$color-1: #b59f88;
$color-2: #d8bda0;
$color-3: #bf7f5b;
$color-4: #494a3c;
$color-5: #5f5c49;

TAILWIND

colors: {
  'brand-1': '#b59f88',
  'brand-2': '#d8bda0',
  'brand-3': '#bf7f5b',
  'brand-4': '#494a3c',
  'brand-5': '#5f5c49',
}

RGB Array

[181, 159, 136], [216, 189, 160], [191, 127, 91], [73, 74, 60], [95, 92, 73]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #B59F88, #D8BDA0, #BF7F5B, #494A3C, #5F5C49 is ideal for: brand design, premium product pages, magazine layouts, 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: #b59f88; --color-2: #d8bda0; --color-3: #bf7f5b; --color-4: #494a3c; --color-5: #5f5c49. 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. 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 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