← Back to Editor

#517368 · #29696E · #3A5166 · #523D4B · #383131

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarmCool

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#517368

Mineral Blue · DimGray · Mint Ice

HEX
#517368
RGB
rgb(81, 115, 104)
HSL
hsl(161, 17%, 38%)
HSB
hsb(161, 30%, 45%)
CMYK
cmyk(30%, 0%, 10%, 55%)
Oklch
oklch(52.6% 0.043 172.5)

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

#29696E

Slate Blue · DarkSlateGray · Mint Ice

HEX
#29696E
RGB
rgb(41, 105, 110)
HSL
hsl(184, 46%, 30%)
HSB
hsb(184, 63%, 43%)
CMYK
cmyk(63%, 5%, 0%, 57%)
Oklch
oklch(48.2% 0.065 202.3)

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

#3A5166

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#3A5166
RGB
rgb(58, 81, 102)
HSL
hsl(209, 28%, 31%)
HSB
hsb(209, 43%, 40%)
CMYK
cmyk(43%, 21%, 0%, 60%)
Oklch
oklch(42.5% 0.045 246.6)

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

#523D4B

Rose Purple · DarkSlateGray · Camellia

HEX
#523D4B
RGB
rgb(82, 61, 75)
HSL
hsl(320, 15%, 28%)
HSB
hsb(320, 26%, 32%)
CMYK
cmyk(0%, 26%, 9%, 68%)
Oklch
oklch(38.8% 0.037 339.1)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#383131

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#383131
RGB
rgb(56, 49, 49)
HSL
hsl(0, 7%, 21%)
HSB
hsb(0, 12%, 22%)
CMYK
cmyk(0%, 13%, 13%, 78%)
Oklch
oklch(32.1% 0.010 17.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

517368
71505B

Analogous

507156
517368
506B71

Triadic

517368
675071
716750

Split-Comp.

517368
71506B
715650

Tetradic

517368
565071
71505B
6B7150

Contrast Matrix WCAG 2.1 Contrast

517368
29696E
3A5166
523D4B
383131
—
1.2
Fail
1.6
Fail
1.9
Fail
2.4
Fail
1.2
Fail
—
1.3
Fail
1.6
Fail
2.0
Fail
1.6
Fail
1.3
Fail
—
1.2
Fail
1.5
Fail
1.9
Fail
1.6
Fail
1.2
Fail
—
1.3
Fail
2.4
Fail
2.0
Fail
1.5
Fail
1.3
Fail
—
White BG
5.2AA
6.3AA
8.2AAA
9.9AAA
12.7AAA
Black BG
4.0AA Large
3.3AA Large
2.5Fail
2.1Fail
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

60606B
45456D
444461
494948
353531

Deuteranopia

5E5B6B
413C6D
434160
4A4C47
353631

Tritanopia

536D6D
2C6C6C
3B5D5C
514544
383131

Achromatopsia

686868
565656
4D4D4D
454545
333333

Shades & Tints Shades & Tints

#517368

Dark
Light

#29696E

Dark
Light

#3A5166

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #517368;
  --color-2: #29696e;
  --color-3: #3a5166;
  --color-4: #523d4b;
  --color-5: #383131;
}

SCSS

$color-1: #517368;
$color-2: #29696e;
$color-3: #3a5166;
$color-4: #523d4b;
$color-5: #383131;

TAILWIND

colors: {
  'brand-1': '#517368',
  'brand-2': '#29696e',
  'brand-3': '#3a5166',
  'brand-4': '#523d4b',
  'brand-5': '#383131',
}

RGB Array

[81, 115, 104], [41, 105, 110], [58, 81, 102], [82, 61, 75], [56, 49, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #517368, #29696E, #3A5166, #523D4B, #383131 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: #517368; --color-2: #29696e; --color-3: #3a5166; --color-4: #523d4b; --color-5: #383131. 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 general-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