← Back to Editor

#806D8B · #685B6C · #4B4C61 · #607578 · #C7B97C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#806D8B

Dark Plum · Gray · Violet

HEX
#806D8B
RGB
rgb(128, 109, 139)
HSL
hsl(278, 12%, 49%)
HSB
hsb(278, 22%, 55%)
CMYK
cmyk(8%, 22%, 0%, 45%)
Oklch
oklch(56.3% 0.051 313.1)

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

#685B6C

Dark Plum · DimGray · Charcoal

HEX
#685B6C
RGB
rgb(104, 91, 108)
HSL
hsl(286, 9%, 39%)
HSB
hsb(286, 16%, 42%)
CMYK
cmyk(4%, 16%, 0%, 58%)
Oklch
oklch(49.0% 0.031 318.2)

Traditional「Dark Plum」· Paint「Charcoal」· Creative Midnight Shadow

#4B4C61

Indigo · DarkSlateGray · Prussian Blue

HEX
#4B4C61
RGB
rgb(75, 76, 97)
HSL
hsl(237, 13%, 34%)
HSB
hsb(237, 23%, 38%)
CMYK
cmyk(23%, 22%, 0%, 62%)
Oklch
oklch(42.4% 0.035 282.7)

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

#607578

Slate Blue · DimGray · Mint Ice

HEX
#607578
RGB
rgb(96, 117, 120)
HSL
hsl(188, 11%, 42%)
HSB
hsb(188, 20%, 47%)
CMYK
cmyk(20%, 3%, 0%, 53%)
Oklch
oklch(54.7% 0.025 207.0)

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

#C7B97C

Ginger · Tan · Sunflower

HEX
#C7B97C
RGB
rgb(199, 185, 124)
HSL
hsl(49, 40%, 63%)
HSB
hsb(49, 38%, 78%)
CMYK
cmyk(0%, 7%, 38%, 22%)
Oklch
oklch(78.3% 0.081 96.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

806D8B
798C6E

Analogous

726E8C
806D8B
8C6E88

Triadic

806D8B
8C816E
6E8C81

Split-Comp.

806D8B
888C6E
6E8C72

Tetradic

806D8B
8C726E
798C6E
6E888C

Contrast Matrix WCAG 2.1 Contrast

806D8B
685B6C
4B4C61
607578
C7B97C
—
1.4
Fail
1.8
Fail
1.0
Fail
2.4
Fail
1.4
Fail
—
1.3
Fail
1.3
Fail
3.2
AA Large
1.8
Fail
1.3
Fail
—
1.7
Fail
4.3
AA Large
1.0
Fail
1.3
Fail
1.7
Fail
—
2.5
Fail
2.4
Fail
3.2
AA Large
4.3
AA Large
2.5
Fail
—
White BG
4.7AA
6.4AA
8.4AAA
4.9AA
2.0Fail
Black BG
4.5AA Large
3.3AA Large
2.5Fail
4.3AA Large
10.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

787884
626268
4B4B5C
696977
C1C18B

Deuteranopia

797A82
636467
4B4B5B
686677
C2C38E

Tritanopia

7F7E7D
676564
4B5857
617777
C69699

Achromatopsia

767676
616161
4E4E4E
6F6F6F
B6B6B6

Shades & Tints Shades & Tints

#806D8B

Dark
Light

#685B6C

Dark
Light

#4B4C61

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #806d8b;
  --color-2: #685b6c;
  --color-3: #4b4c61;
  --color-4: #607578;
  --color-5: #c7b97c;
}

SCSS

$color-1: #806d8b;
$color-2: #685b6c;
$color-3: #4b4c61;
$color-4: #607578;
$color-5: #c7b97c;

TAILWIND

colors: {
  'brand-1': '#806d8b',
  'brand-2': '#685b6c',
  'brand-3': '#4b4c61',
  'brand-4': '#607578',
  'brand-5': '#c7b97c',
}

RGB Array

[128, 109, 139], [104, 91, 108], [75, 76, 97], [96, 117, 120], [199, 185, 124]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #806D8B, #685B6C, #4B4C61, #607578, #C7B97C 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: #806d8b; --color-2: #685b6c; --color-3: #4b4c61; --color-4: #607578; --color-5: #c7b97c. 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 general-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