← Back to Editor

#5E213A · #643B46 · #7E7C4D · #AB9E68 · #DDD5A0

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

#5E213A

Dark Violet · DarkSlateGray · Raspberry

HEX
#5E213A
RGB
rgb(94, 33, 58)
HSL
hsl(335, 48%, 25%)
HSB
hsb(335, 65%, 37%)
CMYK
cmyk(0%, 65%, 38%, 63%)
Oklch
oklch(34.8% 0.093 357.6)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#643B46

Dark Violet · DarkOliveGreen · Camellia

HEX
#643B46
RGB
rgb(100, 59, 70)
HSL
hsl(344, 26%, 31%)
HSB
hsb(344, 41%, 39%)
CMYK
cmyk(0%, 41%, 30%, 61%)
Oklch
oklch(40.5% 0.060 2.7)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#7E7C4D

Autumn Sage · DimGray · Honey Gold

HEX
#7E7C4D
RGB
rgb(126, 124, 77)
HSL
hsl(58, 24%, 40%)
HSB
hsb(58, 39%, 49%)
CMYK
cmyk(0%, 2%, 39%, 51%)
Oklch
oklch(57.6% 0.066 106.2)

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

#AB9E68

Ginger · DarkSeaGreen · Sunflower

HEX
#AB9E68
RGB
rgb(171, 158, 104)
HSL
hsl(48, 29%, 54%)
HSB
hsb(48, 39%, 67%)
CMYK
cmyk(0%, 8%, 39%, 33%)
Oklch
oklch(69.8% 0.074 96.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#DDD5A0

Fresh Green · Wheat · Sunflower

HEX
#DDD5A0
RGB
rgb(221, 213, 160)
HSL
hsl(52, 47%, 75%)
HSB
hsb(52, 28%, 87%)
CMYK
cmyk(0%, 4%, 28%, 13%)
Oklch
oklch(86.7% 0.070 100.5)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5E213A
215E45

Analogous

5E2159
5E213A
5E2621

Triadic

5E213A
3B5E21
213B5E

Split-Comp.

5E213A
215E26
21595E

Tetradic

5E213A
595E21
215E45
26215E

Contrast Matrix WCAG 2.1 Contrast

5E213A
643B46
7E7C4D
AB9E68
DDD5A0
—
1.3
Fail
2.8
Fail
4.5
AA Large
8.0
AAA
1.3
Fail
—
2.2
Fail
3.5
AA Large
6.3
AA
2.8
Fail
2.2
Fail
—
1.6
Fail
2.9
Fail
4.5
AA Large
3.5
AA Large
1.6
Fail
—
1.8
Fail
8.0
AAA
6.3
AA
2.9
Fail
1.8
Fail
—
White BG
12.0AAA
9.3AAA
4.3AA Large
2.7Fail
1.5Fail
Black BG
1.8Fail
2.3Fail
4.9AA
7.8AAA
14.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

444334
525243
7D7D58
A5A575
DAD9AD

Deuteranopia

474C32
555843
7D7D5B
A6A778
DADBB0

Tritanopia

5B2F2E
624141
7E6163
AA7F82
DDB7B9

Achromatopsia

363636
494949
777777
9C9C9C
D1D1D1

Shades & Tints Shades & Tints

#5E213A

Dark
Light

#643B46

Dark
Light

#7E7C4D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5e213a;
  --color-2: #643b46;
  --color-3: #7e7c4d;
  --color-4: #ab9e68;
  --color-5: #ddd5a0;
}

SCSS

$color-1: #5e213a;
$color-2: #643b46;
$color-3: #7e7c4d;
$color-4: #ab9e68;
$color-5: #ddd5a0;

TAILWIND

colors: {
  'brand-1': '#5e213a',
  'brand-2': '#643b46',
  'brand-3': '#7e7c4d',
  'brand-4': '#ab9e68',
  'brand-5': '#ddd5a0',
}

RGB Array

[94, 33, 58], [100, 59, 70], [126, 124, 77], [171, 158, 104], [221, 213, 160]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #5E213A, #643B46, #7E7C4D, #AB9E68, #DDD5A0 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #5e213a; --color-2: #643b46; --color-3: #7e7c4d; --color-4: #ab9e68; --color-5: #ddd5a0. 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. 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