← Back to Editor

#55453A · #575341 · #496959 · #738D68 · #8B9E5C

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

#55453A

Tangerine · DarkOliveGreen · Amber Brown

HEX
#55453A
RGB
rgb(85, 69, 58)
HSL
hsl(24, 19%, 28%)
HSB
hsb(24, 32%, 33%)
CMYK
cmyk(0%, 19%, 32%, 67%)
Oklch
oklch(40.4% 0.028 56.3)

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

#575341

Ochre · DarkOliveGreen · Honey Gold

HEX
#575341
RGB
rgb(87, 83, 65)
HSL
hsl(49, 14%, 30%)
HSB
hsb(49, 25%, 34%)
CMYK
cmyk(0%, 5%, 25%, 66%)
Oklch
oklch(44.1% 0.029 97.0)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#496959

Mineral Blue · DimGray · Forest Green

HEX
#496959
RGB
rgb(73, 105, 89)
HSL
hsl(150, 18%, 35%)
HSB
hsb(150, 30%, 41%)
CMYK
cmyk(30%, 0%, 15%, 59%)
Oklch
oklch(49.1% 0.045 162.4)

Traditional「Mineral Blue」· Paint「Forest Green」· Creative Blush Sunrise

#738D68

Celadon · Gray · Olive Green

HEX
#738D68
RGB
rgb(115, 141, 104)
HSL
hsl(102, 15%, 48%)
HSB
hsb(102, 26%, 55%)
CMYK
cmyk(18%, 0%, 26%, 45%)
Oklch
oklch(61.3% 0.062 136.5)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#8B9E5C

Grass Green · Gray · Olive Green

HEX
#8B9E5C
RGB
rgb(139, 158, 92)
HSL
hsl(77, 26%, 49%)
HSB
hsb(77, 42%, 62%)
CMYK
cmyk(12%, 0%, 42%, 38%)
Oklch
oklch(66.8% 0.093 122.1)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

55453A
3A4A55

Analogous

553A3D
55453A
55523A

Triadic

55453A
3A5545
453A55

Split-Comp.

55453A
3A5552
3A3D55

Tetradic

55453A
3D553A
3A4A55
523A55

Contrast Matrix WCAG 2.1 Contrast

55453A
575341
496959
738D68
8B9E5C
—
1.2
Fail
1.5
Fail
2.5
Fail
3.1
AA Large
1.2
Fail
—
1.3
Fail
2.1
Fail
2.6
Fail
1.5
Fail
1.3
Fail
—
1.7
Fail
2.1
Fail
2.5
Fail
2.1
Fail
1.7
Fail
—
1.2
Fail
3.1
AA Large
2.6
Fail
2.1
Fail
1.2
Fail
—
White BG
9.1AAA
7.7AAA
6.1AA
3.7AA Large
2.9Fail
Black BG
2.3Fail
2.7Fail
3.4AA Large
5.7AA
7.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4E4E3D
555545
57575D
7E7E71
93936C

Deuteranopia

4F503D
565646
55535E
7D7B73
929170

Tritanopia

543F3F
57494A
4B6061
74787A
8C797B

Achromatopsia

494949
525252
5E5E5E
818181
919191

Shades & Tints Shades & Tints

#55453A

Dark
Light

#575341

Dark
Light

#496959

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #55453a;
  --color-2: #575341;
  --color-3: #496959;
  --color-4: #738d68;
  --color-5: #8b9e5c;
}

SCSS

$color-1: #55453a;
$color-2: #575341;
$color-3: #496959;
$color-4: #738d68;
$color-5: #8b9e5c;

TAILWIND

colors: {
  'brand-1': '#55453a',
  'brand-2': '#575341',
  'brand-3': '#496959',
  'brand-4': '#738d68',
  'brand-5': '#8b9e5c',
}

RGB Array

[85, 69, 58], [87, 83, 65], [73, 105, 89], [115, 141, 104], [139, 158, 92]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #55453A, #575341, #496959, #738D68, #8B9E5C is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. 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: #55453a; --color-2: #575341; --color-3: #496959; --color-4: #738d68; --color-5: #8b9e5c. 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. 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