← Back to Editor

#5E283F · #663F50 · #80606A · #A69380 · #B3AC81

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

#5E283F

Dark Violet · DarkSlateGray · Camellia

HEX
#5E283F
RGB
rgb(94, 40, 63)
HSL
hsl(334, 40%, 26%)
HSB
hsb(334, 57%, 37%)
CMYK
cmyk(0%, 57%, 33%, 63%)
Oklch
oklch(36.0% 0.084 355.4)

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

#663F50

Dark Violet · DimGray · Camellia

HEX
#663F50
RGB
rgb(102, 63, 80)
HSL
hsl(334, 24%, 32%)
HSB
hsb(334, 38%, 40%)
CMYK
cmyk(0%, 38%, 22%, 60%)
Oklch
oklch(41.9% 0.059 352.3)

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

#80606A

Dark Violet · DimGray · Camellia

HEX
#80606A
RGB
rgb(128, 96, 106)
HSL
hsl(341, 14%, 44%)
HSB
hsb(341, 25%, 50%)
CMYK
cmyk(0%, 25%, 17%, 50%)
Oklch
oklch(52.5% 0.044 358.2)

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

#A69380

Ginger · Gray · Warm Sun

HEX
#A69380
RGB
rgb(166, 147, 128)
HSL
hsl(30, 18%, 58%)
HSB
hsb(30, 23%, 65%)
CMYK
cmyk(0%, 11%, 23%, 35%)
Oklch
oklch(67.5% 0.035 67.2)

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

#B3AC81

Autumn Sage · Tan · Sunflower

HEX
#B3AC81
RGB
rgb(179, 172, 129)
HSL
hsl(52, 25%, 60%)
HSB
hsb(52, 28%, 70%)
CMYK
cmyk(0%, 4%, 28%, 30%)
Oklch
oklch(73.9% 0.059 99.9)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5E283F
285D46

Analogous

5D2859
5E283F
5D2B28

Triadic

5E283F
3F5D28
283F5D

Split-Comp.

5E283F
285D2B
28595D

Tetradic

5E283F
595D28
285D46
2B285D

Contrast Matrix WCAG 2.1 Contrast

5E283F
663F50
80606A
A69380
B3AC81
—
1.3
Fail
2.1
Fail
3.8
AA Large
4.9
AA
1.3
Fail
—
1.6
Fail
3.0
Fail
3.8
AA Large
2.1
Fail
1.6
Fail
—
1.9
Fail
2.4
Fail
3.8
AA Large
3.0
Fail
1.9
Fail
—
1.3
Fail
4.9
AA
3.8
AA Large
2.4
Fail
1.3
Fail
—
White BG
11.3AAA
8.8AAA
5.5AA
3.0Fail
2.3Fail
Black BG
1.9Fail
2.4Fail
3.8AA Large
7.1AAA
9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

474639
55554C
727268
9E9E85
B0B08B

Deuteranopia

4A4E38
575A4B
747667
9FA086
B0B18E

Tritanopia

5B3534
644948
7E6665
A58889
B39495

Achromatopsia

3B3B3B
4D4D4D
6B6B6B
979797
A9A9A9

Shades & Tints Shades & Tints

#5E283F

Dark
Light

#663F50

Dark
Light

#80606A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5e283f;
  --color-2: #663f50;
  --color-3: #80606a;
  --color-4: #a69380;
  --color-5: #b3ac81;
}

SCSS

$color-1: #5e283f;
$color-2: #663f50;
$color-3: #80606a;
$color-4: #a69380;
$color-5: #b3ac81;

TAILWIND

colors: {
  'brand-1': '#5e283f',
  'brand-2': '#663f50',
  'brand-3': '#80606a',
  'brand-4': '#a69380',
  'brand-5': '#b3ac81',
}

RGB Array

[94, 40, 63], [102, 63, 80], [128, 96, 106], [166, 147, 128], [179, 172, 129]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #5E283F, #663F50, #80606A, #A69380, #B3AC81 is ideal for: brand design, premium product pages, magazine layouts. 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: #5e283f; --color-2: #663f50; --color-3: #80606a; --color-4: #a69380; --color-5: #b3ac81. 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. 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