← Back to Editor

#394040 · #455454 · #748062 · #AB875E · #DB876B

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

#394040

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#394040
RGB
rgb(57, 64, 64)
HSL
hsl(180, 6%, 24%)
HSB
hsb(180, 11%, 25%)
CMYK
cmyk(11%, 0%, 0%, 75%)
Oklch
oklch(36.5% 0.009 196.8)

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

#455454

Slate Blue · DarkSlateGray · Mint Ice

HEX
#455454
RGB
rgb(69, 84, 84)
HSL
hsl(180, 10%, 30%)
HSB
hsb(180, 18%, 33%)
CMYK
cmyk(18%, 0%, 0%, 67%)
Oklch
oklch(43.3% 0.019 196.5)

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

#748062

Grass Green · DimGray · Olive Green

HEX
#748062
RGB
rgb(116, 128, 98)
HSL
hsl(84, 13%, 44%)
HSB
hsb(84, 23%, 50%)
CMYK
cmyk(9%, 0%, 23%, 50%)
Oklch
oklch(58.1% 0.046 125.5)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#AB875E

Ginger · Gray · Warm Sun

HEX
#AB875E
RGB
rgb(171, 135, 94)
HSL
hsl(32, 31%, 52%)
HSB
hsb(32, 45%, 67%)
CMYK
cmyk(0%, 21%, 45%, 33%)
Oklch
oklch(64.8% 0.071 69.7)

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

#DB876B

Apricot · DarkSalmon · Warm Sun

HEX
#DB876B
RGB
rgb(219, 135, 107)
HSL
hsl(15, 61%, 64%)
HSB
hsb(15, 51%, 86%)
CMYK
cmyk(0%, 38%, 51%, 14%)
Oklch
oklch(70.5% 0.111 39.2)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

394040
413A3A

Analogous

3A413D
394040
3A3D41

Triadic

394040
413A41
41413A

Split-Comp.

394040
413A3D
413D3A

Tetradic

394040
3D3A41
413A3A
3D413A

Contrast Matrix WCAG 2.1 Contrast

394040
455454
748062
AB875E
DB876B
—
1.3
Fail
2.5
Fail
3.2
AA Large
3.9
AA Large
1.3
Fail
—
1.9
Fail
2.4
Fail
2.9
Fail
2.5
Fail
1.9
Fail
—
1.3
Fail
1.5
Fail
3.2
AA Large
2.4
Fail
1.3
Fail
—
1.2
Fail
3.9
AA Large
2.9
Fail
1.5
Fail
1.2
Fail
—
White BG
10.6AAA
7.9AAA
4.2AA Large
3.3AA Large
2.7Fail
Black BG
2.0Fail
2.6Fail
5.0AA
6.4AA
7.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3C3C40
4B4C54
797969
9B9B68
B7B672

Deuteranopia

3C3B40
4B4A54
79786B
9EA06A
BCC273

Tritanopia

394040
465454
756F70
A97071
D77778

Achromatopsia

3E3E3E
505050
797979
8D8D8D
9D9D9D

Shades & Tints Shades & Tints

#394040

Dark
Light

#455454

Dark
Light

#748062

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #394040;
  --color-2: #455454;
  --color-3: #748062;
  --color-4: #ab875e;
  --color-5: #db876b;
}

SCSS

$color-1: #394040;
$color-2: #455454;
$color-3: #748062;
$color-4: #ab875e;
$color-5: #db876b;

TAILWIND

colors: {
  'brand-1': '#394040',
  'brand-2': '#455454',
  'brand-3': '#748062',
  'brand-4': '#ab875e',
  'brand-5': '#db876b',
}

RGB Array

[57, 64, 64], [69, 84, 84], [116, 128, 98], [171, 135, 94], [219, 135, 107]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #394040, #455454, #748062, #AB875E, #DB876B 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: #394040; --color-2: #455454; --color-3: #748062; --color-4: #ab875e; --color-5: #db876b. 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