← Back to Editor

#6C706D · #A04B3E · #A36140 · #6E5C41 · #314040

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

#6C706D

Ink Gray · DimGray · Warm Gray

HEX
#6C706D
RGB
rgb(108, 112, 109)
HSL
hsl(135, 2%, 43%)
HSB
hsb(135, 4%, 44%)
CMYK
cmyk(4%, 0%, 3%, 56%)
Oklch
oklch(54.1% 0.007 153.7)

TraditionalInk Gray」· PaintWarm Gray」· Creative Urban Concrete

#A04B3E

Crimson · Sienna · Passion Red

HEX
#A04B3E
RGB
rgb(160, 75, 62)
HSL
hsl(8, 44%, 44%)
HSB
hsb(8, 61%, 63%)
CMYK
cmyk(0%, 53%, 61%, 37%)
Oklch
oklch(51.8% 0.116 30.4)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#A36140

Tangerine · Sienna · Amber Brown

HEX
#A36140
RGB
rgb(163, 97, 64)
HSL
hsl(20, 44%, 45%)
HSB
hsb(20, 61%, 64%)
CMYK
cmyk(0%, 40%, 61%, 36%)
Oklch
oklch(56.0% 0.098 46.6)

TraditionalTangerine」· PaintAmber Brown」· Creative Blush Sunrise

#6E5C41

Ochre · DarkOliveGreen · Amber Brown

HEX
#6E5C41
RGB
rgb(110, 92, 65)
HSL
hsl(36, 26%, 34%)
HSB
hsb(36, 41%, 43%)
CMYK
cmyk(0%, 16%, 41%, 57%)
Oklch
oklch(48.5% 0.047 77.4)

TraditionalOchre」· PaintAmber Brown」· Creative Blush Sunrise

#314040

Slate Blue · DarkSlateGray · Peacock Green

HEX
#314040
RGB
rgb(49, 64, 64)
HSL
hsl(180, 13%, 22%)
HSB
hsb(180, 23%, 25%)
CMYK
cmyk(23%, 0%, 0%, 75%)
Oklch
oklch(35.8% 0.019 196.3)

TraditionalSlate Blue」· PaintPeacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6C706D
706B6F

Analogous

6D706B
6C706D
6B706F

Triadic

6C706D
6D6B70
706D6B

Split-Comp.

6C706D
6F6B70
706B6D

Tetradic

6C706D
6B6D70
706B6F
706F6B

Contrast Matrix WCAG 2.1 Contrast

6C706D
A04B3E
A36140
6E5C41
314040
1.2
Fail
1.0
Fail
1.3
Fail
2.2
Fail
1.2
Fail
1.2
Fail
1.1
Fail
1.8
Fail
1.0
Fail
1.2
Fail
1.3
Fail
2.2
Fail
1.3
Fail
1.1
Fail
1.3
Fail
1.7
Fail
2.2
Fail
1.8
Fail
2.2
Fail
1.7
Fail
White BG
5.0AA
5.9AA
4.8AA
6.4AA
10.8AAA
Black BG
4.2AA Large
3.6AA Large
4.3AA Large
3.3AA Large
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

6E6E6E
7B7A41
868648
666648
373840

Deuteranopia

6E6D6E
808742
8A8F4A
676949
373640

Tritanopia

6C6E6E
9C4444
A04E50
6D4D4E
324040

Achromatopsia

6E6E6E
636363
717171
5E5E5E
3C3C3C

Shades & Tints Shades & Tints

#6C706D

Dark
Light

#A04B3E

Dark
Light

#A36140

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6c706d;
  --color-2: #a04b3e;
  --color-3: #a36140;
  --color-4: #6e5c41;
  --color-5: #314040;
}

SCSS

$color-1: #6c706d;
$color-2: #a04b3e;
$color-3: #a36140;
$color-4: #6e5c41;
$color-5: #314040;

TAILWIND

colors: {
  'brand-1': '#6c706d',
  'brand-2': '#a04b3e',
  'brand-3': '#a36140',
  'brand-4': '#6e5c41',
  'brand-5': '#314040',
}

RGB Array

[108, 112, 109], [160, 75, 62], [163, 97, 64], [110, 92, 65], [49, 64, 64]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6C706D, #A04B3E, #A36140, #6E5C41, #314040 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: #6c706d; --color-2: #a04b3e; --color-3: #a36140; --color-4: #6e5c41; --color-5: #314040. 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