← Back to Editor

#5D6669 · #63576B · #704B4F · #966156 · #AD7D5F

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

#5D6669

Ink Gray · DimGray · Charcoal

HEX
#5D6669
RGB
rgb(93, 102, 105)
HSL
hsl(195, 6%, 39%)
HSB
hsb(195, 11%, 41%)
CMYK
cmyk(11%, 3%, 0%, 59%)
Oklch
oklch(50.4% 0.012 219.7)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#63576B

Dark Plum · DimGray · Eggplant

HEX
#63576B
RGB
rgb(99, 87, 107)
HSL
hsl(276, 10%, 38%)
HSB
hsb(276, 19%, 42%)
CMYK
cmyk(7%, 19%, 0%, 58%)
Oklch
oklch(47.6% 0.035 311.8)

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

#704B4F

Crimson · DimGray · Wine Red

HEX
#704B4F
RGB
rgb(112, 75, 79)
HSL
hsl(354, 20%, 37%)
HSB
hsb(354, 33%, 44%)
CMYK
cmyk(0%, 33%, 29%, 56%)
Oklch
oklch(45.5% 0.051 12.1)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#966156

Crimson · Sienna · Passion Red

HEX
#966156
RGB
rgb(150, 97, 86)
HSL
hsl(10, 27%, 46%)
HSB
hsb(10, 43%, 59%)
CMYK
cmyk(0%, 35%, 43%, 41%)
Oklch
oklch(54.7% 0.072 32.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#AD7D5F

Tangerine · Gray · Warm Sun

HEX
#AD7D5F
RGB
rgb(173, 125, 95)
HSL
hsl(23, 32%, 53%)
HSB
hsb(23, 45%, 68%)
CMYK
cmyk(0%, 28%, 45%, 32%)
Oklch
oklch(63.0% 0.074 53.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5D6669
69605D

Analogous

5D6966
5D6669
5D6069

Triadic

5D6669
695D66
66695D

Split-Comp.

5D6669
695D60
69665D

Tetradic

5D6669
665D69
69605D
60695D

Contrast Matrix WCAG 2.1 Contrast

5D6669
63576B
704B4F
966156
AD7D5F
—
1.1
Fail
1.3
Fail
1.2
Fail
1.6
Fail
1.1
Fail
—
1.1
Fail
1.3
Fail
1.9
Fail
1.3
Fail
1.1
Fail
—
1.5
Fail
2.1
Fail
1.2
Fail
1.3
Fail
1.5
Fail
—
1.4
Fail
1.6
Fail
1.9
Fail
2.1
Fail
1.4
Fail
—
White BG
5.9AA
6.8AA
7.5AAA
5.1AA
3.6AA Large
Black BG
3.6AA Large
3.1AA Large
2.8Fail
4.1AA Large
5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

616168
5E5E66
60604E
7F7F59
989866

Deuteranopia

606068
5F5F65
62654E
828659
9B9F68

Tritanopia

5D6868
626262
6E4D4D
935B5B
AB6C6D

Achromatopsia

646464
5D5D5D
575757
707070
888888

Shades & Tints Shades & Tints

#5D6669

Dark
Light

#63576B

Dark
Light

#704B4F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5d6669;
  --color-2: #63576b;
  --color-3: #704b4f;
  --color-4: #966156;
  --color-5: #ad7d5f;
}

SCSS

$color-1: #5d6669;
$color-2: #63576b;
$color-3: #704b4f;
$color-4: #966156;
$color-5: #ad7d5f;

TAILWIND

colors: {
  'brand-1': '#5d6669',
  'brand-2': '#63576b',
  'brand-3': '#704b4f',
  'brand-4': '#966156',
  'brand-5': '#ad7d5f',
}

RGB Array

[93, 102, 105], [99, 87, 107], [112, 75, 79], [150, 97, 86], [173, 125, 95]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5D6669, #63576B, #704B4F, #966156, #AD7D5F 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: #5d6669; --color-2: #63576b; --color-3: #704b4f; --color-4: #966156; --color-5: #ad7d5f. 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