← Back to Editor

#C0B8A5 · #806456 · #715746 · #41322B · #1C1616

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

#C0B8A5

Ginger · DarkGray · Sunflower

HEX
#C0B8A5
RGB
rgb(192, 184, 165)
HSL
hsl(42, 18%, 70%)
HSB
hsb(42, 14%, 75%)
CMYK
cmyk(0%, 4%, 14%, 25%)
Oklch
oklch(78.4% 0.028 87.9)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#806456

Tangerine · DimGray · Amber Brown

HEX
#806456
RGB
rgb(128, 100, 86)
HSL
hsl(20, 20%, 42%)
HSB
hsb(20, 33%, 50%)
CMYK
cmyk(0%, 22%, 33%, 50%)
Oklch
oklch(52.7% 0.042 47.9)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#715746

Tangerine · DimGray · Amber Brown

HEX
#715746
RGB
rgb(113, 87, 70)
HSL
hsl(24, 23%, 36%)
HSB
hsb(24, 38%, 44%)
CMYK
cmyk(0%, 23%, 38%, 56%)
Oklch
oklch(47.9% 0.043 54.6)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#41322B

Tangerine · DarkSlateGray · Cinnamon

HEX
#41322B
RGB
rgb(65, 50, 43)
HSL
hsl(19, 20%, 21%)
HSB
hsb(19, 34%, 25%)
CMYK
cmyk(0%, 23%, 34%, 75%)
Oklch
oklch(33.2% 0.025 46.3)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#1C1616

Crimson · Black · Deep Berry

HEX
#1C1616
RGB
rgb(28, 22, 22)
HSL
hsl(0, 12%, 10%)
HSB
hsb(0, 21%, 11%)
CMYK
cmyk(0%, 21%, 21%, 89%)
Oklch
oklch(20.7% 0.010 18.0)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C0B8A5
A5ADC0

Analogous

C0AAA5
C0B8A5
BBC0A5

Triadic

C0B8A5
A5C0B8
B8A5C0

Split-Comp.

C0B8A5
A5BBC0
AAA5C0

Tetradic

C0B8A5
A5C0AA
A5ADC0
C0A5BB

Contrast Matrix WCAG 2.1 Contrast

C0B8A5
806456
715746
41322B
1C1616
—
2.7
Fail
3.4
AA Large
6.2
AA
9.1
AAA
2.7
Fail
—
1.2
Fail
2.3
Fail
3.3
AA Large
3.4
AA Large
1.2
Fail
—
1.8
Fail
2.7
Fail
6.2
AA
2.3
Fail
1.8
Fail
—
1.5
Fail
9.1
AAA
3.3
AA Large
2.7
Fail
1.5
Fail
—
White BG
2.0Fail
5.4AA
6.7AA
12.2AAA
17.9AAA
Black BG
10.6AAA
3.9AA Large
3.2AA Large
1.7Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BDBCAA
747459
66664A
3B3A2D
191916

Deuteranopia

BDBEAB
76785A
67694B
3B3D2D
1A1A16

Tritanopia

C0ADAE
7F5C5D
704D4E
402E2E
1C1616

Achromatopsia

B8B8B8
6B6B6B
5D5D5D
363636
181818

Shades & Tints Shades & Tints

#C0B8A5

Dark
Light

#806456

Dark
Light

#715746

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c0b8a5;
  --color-2: #806456;
  --color-3: #715746;
  --color-4: #41322b;
  --color-5: #1c1616;
}

SCSS

$color-1: #c0b8a5;
$color-2: #806456;
$color-3: #715746;
$color-4: #41322b;
$color-5: #1c1616;

TAILWIND

colors: {
  'brand-1': '#c0b8a5',
  'brand-2': '#806456',
  'brand-3': '#715746',
  'brand-4': '#41322b',
  'brand-5': '#1c1616',
}

RGB Array

[192, 184, 165], [128, 100, 86], [113, 87, 70], [65, 50, 43], [28, 22, 22]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #C0B8A5, #806456, #715746, #41322B, #1C1616 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, 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: #c0b8a5; --color-2: #806456; --color-3: #715746; --color-4: #41322b; --color-5: #1c1616. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 finance, legal, luxury 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