← Back to Editor

#420C47 · #4A2B54 · #514B60 · #596A6D · #618A7A

nature

A 5-color nature palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

CalmOrganicGroundedCool

Industry INDUSTRY

EcoWellnessOutdoor

UI Context UI CONTEXT

Brand WebsiteBlog

Color Details Color Details

#420C47

Royal Purple · MidnightBlue · Dark Purple

HEX
#420C47
RGB
rgb(66, 12, 71)
HSL
hsl(295, 71%, 16%)
HSB
hsb(295, 83%, 28%)
CMYK
cmyk(7%, 83%, 0%, 72%)
Oklch
oklch(28.1% 0.112 324.2)

Traditional「Royal Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#4A2B54

Dark Plum · DarkSlateGray · Eggplant

HEX
#4A2B54
RGB
rgb(74, 43, 84)
HSL
hsl(285, 32%, 25%)
HSB
hsb(285, 49%, 33%)
CMYK
cmyk(12%, 49%, 0%, 67%)
Oklch
oklch(34.6% 0.079 317.5)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#514B60

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#514B60
RGB
rgb(81, 75, 96)
HSL
hsl(257, 12%, 34%)
HSB
hsb(257, 22%, 38%)
CMYK
cmyk(16%, 22%, 0%, 62%)
Oklch
oklch(42.7% 0.035 298.0)

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

#596A6D

Slate Blue · DimGray · Mint Ice

HEX
#596A6D
RGB
rgb(89, 106, 109)
HSL
hsl(189, 10%, 39%)
HSB
hsb(189, 18%, 43%)
CMYK
cmyk(18%, 3%, 0%, 57%)
Oklch
oklch(51.1% 0.021 209.4)

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

#618A7A

Mineral Blue · SlateGray · Olive Green

HEX
#618A7A
RGB
rgb(97, 138, 122)
HSL
hsl(157, 17%, 46%)
HSB
hsb(157, 30%, 54%)
CMYK
cmyk(30%, 0%, 12%, 46%)
Oklch
oklch(59.8% 0.052 168.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

420C47
11460C

Analogous

240C46
420C47
460C2E

Triadic

420C47
46410C
0C4641

Split-Comp.

420C47
2E460C
0C4624

Tetradic

420C47
46240C
11460C
0C2E46

Contrast Matrix WCAG 2.1 Contrast

420C47
4A2B54
514B60
596A6D
618A7A
—
1.3
Fail
1.8
Fail
2.7
Fail
3.9
AA Large
1.3
Fail
—
1.4
Fail
2.1
Fail
3.1
AA Large
1.8
Fail
1.4
Fail
—
1.5
Fail
2.1
Fail
2.7
Fail
2.1
Fail
1.5
Fail
—
1.5
Fail
3.9
AA Large
3.1
AA Large
2.1
Fail
1.5
Fail
—
White BG
15.3AAA
11.9AAA
8.3AAA
5.7AA
3.9AA Large
Black BG
1.4Fail
1.8Fail
2.5Fail
3.7AA Large
5.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2A39
3D3C4A
4E4E5B
60616C
73737E

Deuteranopia

2E3235
3E4148
4F4F5A
5F5E6C
706D7F

Tritanopia

3F2D2B
484241
515756
5A6C6C
638182

Achromatopsia

232323
393939
4F4F4F
656565
7C7C7C

Shades & Tints Shades & Tints

#420C47

Dark
Light

#4A2B54

Dark
Light

#514B60

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #420c47;
  --color-2: #4a2b54;
  --color-3: #514b60;
  --color-4: #596a6d;
  --color-5: #618a7a;
}

SCSS

$color-1: #420c47;
$color-2: #4a2b54;
$color-3: #514b60;
$color-4: #596a6d;
$color-5: #618a7a;

TAILWIND

colors: {
  'brand-1': '#420c47',
  'brand-2': '#4a2b54',
  'brand-3': '#514b60',
  'brand-4': '#596a6d',
  'brand-5': '#618a7a',
}

RGB Array

[66, 12, 71], [74, 43, 84], [81, 75, 96], [89, 106, 109], [97, 138, 122]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This nature-style palette of #420C47, #4A2B54, #514B60, #596A6D, #618A7A 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: #420c47; --color-2: #4a2b54; --color-3: #514b60; --color-4: #596a6d; --color-5: #618a7a. 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