← Back to Editor

#323538 · #354157 · #345C5E · #677549 · #998A29

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

#323538

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#323538
RGB
rgb(50, 53, 56)
HSL
hsl(210, 6%, 21%)
HSB
hsb(210, 11%, 22%)
CMYK
cmyk(11%, 5%, 0%, 78%)
Oklch
oklch(32.7% 0.007 248.0)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#354157

Indigo · DarkSlateGray · Prussian Blue

HEX
#354157
RGB
rgb(53, 65, 87)
HSL
hsl(219, 24%, 27%)
HSB
hsb(219, 39%, 34%)
CMYK
cmyk(39%, 25%, 0%, 66%)
Oklch
oklch(37.4% 0.041 262.3)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#345C5E

Slate Blue · DarkSlateGray · Mint Ice

HEX
#345C5E
RGB
rgb(52, 92, 94)
HSL
hsl(183, 29%, 29%)
HSB
hsb(183, 45%, 37%)
CMYK
cmyk(45%, 2%, 0%, 63%)
Oklch
oklch(44.6% 0.045 199.8)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#677549

Grass Green · DarkOliveGreen · Forest Green

HEX
#677549
RGB
rgb(103, 117, 73)
HSL
hsl(79, 23%, 37%)
HSB
hsb(79, 38%, 46%)
CMYK
cmyk(12%, 0%, 38%, 54%)
Oklch
oklch(53.9% 0.067 123.0)

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

#998A29

Autumn Sage · DarkGoldenRod · Honey Gold

HEX
#998A29
RGB
rgb(153, 138, 41)
HSL
hsl(52, 58%, 38%)
HSB
hsb(52, 73%, 60%)
CMYK
cmyk(0%, 10%, 73%, 40%)
Oklch
oklch(62.9% 0.115 100.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

323538
393632

Analogous

323939
323538
323239

Triadic

323538
393236
363932

Split-Comp.

323538
393232
393932

Tetradic

323538
393239
393632
323932

Contrast Matrix WCAG 2.1 Contrast

323538
354157
345C5E
677549
998A29
—
1.2
Fail
1.7
Fail
2.5
Fail
3.5
AA Large
1.2
Fail
—
1.4
Fail
2.1
Fail
2.9
Fail
1.7
Fail
1.4
Fail
—
1.5
Fail
2.1
Fail
2.5
Fail
2.1
Fail
1.5
Fail
—
1.4
Fail
3.5
AA Large
2.9
Fail
2.1
Fail
1.4
Fail
—
White BG
12.3AAA
10.3AAA
7.4AAA
5.0AA
3.5AA Large
Black BG
1.7Fail
2.0Fail
2.8Fail
4.2AA Large
6.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

333337
3A3A52
45465E
6D6D54
939240

Deuteranopia

333337
3A3950
43405D
6C6B56
939546

Tritanopia

323737
364D4D
365D5D
685C5E
985357

Achromatopsia

343434
404040
505050
6C6C6C
838383

Shades & Tints Shades & Tints

#323538

Dark
Light

#354157

Dark
Light

#345C5E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #323538;
  --color-2: #354157;
  --color-3: #345c5e;
  --color-4: #677549;
  --color-5: #998a29;
}

SCSS

$color-1: #323538;
$color-2: #354157;
$color-3: #345c5e;
$color-4: #677549;
$color-5: #998a29;

TAILWIND

colors: {
  'brand-1': '#323538',
  'brand-2': '#354157',
  'brand-3': '#345c5e',
  'brand-4': '#677549',
  'brand-5': '#998a29',
}

RGB Array

[50, 53, 56], [53, 65, 87], [52, 92, 94], [103, 117, 73], [153, 138, 41]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #323538, #354157, #345C5E, #677549, #998A29 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: #323538; --color-2: #354157; --color-3: #345c5e; --color-4: #677549; --color-5: #998a29. 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