← Back to Editor

#4A4040 · #5D5055 · #6E646E · #8BA49F · #C9DFC2

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 LibraryData Visualization

Color Details Color Details

#4A4040

Dark Cyan · DarkSlateGray · Charcoal

HEX
#4A4040
RGB
rgb(74, 64, 64)
HSL
hsl(0, 7%, 27%)
HSB
hsb(0, 14%, 29%)
CMYK
cmyk(0%, 14%, 14%, 71%)
Oklch
oklch(38.2% 0.014 17.8)

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

#5D5055

Dark Violet · DimGray · Charcoal

HEX
#5D5055
RGB
rgb(93, 80, 85)
HSL
hsl(337, 8%, 34%)
HSB
hsb(337, 14%, 36%)
CMYK
cmyk(0%, 14%, 9%, 64%)
Oklch
oklch(44.6% 0.019 352.7)

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

#6E646E

Ink Gray · DimGray · Warm Gray

HEX
#6E646E
RGB
rgb(110, 100, 110)
HSL
hsl(300, 5%, 41%)
HSB
hsb(300, 9%, 43%)
CMYK
cmyk(0%, 9%, 0%, 57%)
Oklch
oklch(51.6% 0.020 325.9)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#8BA49F

Mineral Blue · DarkSeaGreen · Lake Green

HEX
#8BA49F
RGB
rgb(139, 164, 159)
HSL
hsl(168, 12%, 59%)
HSB
hsb(168, 15%, 64%)
CMYK
cmyk(15%, 0%, 3%, 36%)
Oklch
oklch(69.8% 0.029 182.0)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#C9DFC2

Celadon · LightGray · Mint Green

HEX
#C9DFC2
RGB
rgb(201, 223, 194)
HSL
hsl(106, 31%, 82%)
HSB
hsb(106, 13%, 87%)
CMYK
cmyk(10%, 0%, 13%, 13%)
Oklch
oklch(87.9% 0.046 138.1)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4A4040
404A4A

Analogous

4A4045
4A4040
4A4540

Triadic

4A4040
404A40
40404A

Split-Comp.

4A4040
404A45
40454A

Tetradic

4A4040
454A40
404A4A
45404A

Contrast Matrix WCAG 2.1 Contrast

4A4040
5D5055
6E646E
8BA49F
C9DFC2
—
1.3
Fail
1.8
Fail
3.8
AA Large
7.1
AAA
1.3
Fail
—
1.4
Fail
2.9
Fail
5.4
AA
1.8
Fail
1.4
Fail
—
2.1
Fail
4.0
AA Large
3.8
AA Large
2.9
Fail
2.1
Fail
—
1.9
Fail
7.1
AAA
5.4
AA
4.0
AA Large
1.9
Fail
—
White BG
10.0AAA
7.7AAA
5.7AA
2.7Fail
1.4Fail
Black BG
2.1Fail
2.7Fail
3.7AA Large
7.9AAA
14.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

464640
575754
6A6A6C
9696A0
D3D3C9

Deuteranopia

464740
585954
6A6B6B
9493A1
D1D0CB

Tritanopia

4A4040
5C5353
6E6A69
8CA1A1
CACFD0

Achromatopsia

434343
545454
686868
9C9C9C
D5D5D5

Shades & Tints Shades & Tints

#4A4040

Dark
Light

#5D5055

Dark
Light

#6E646E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4a4040;
  --color-2: #5d5055;
  --color-3: #6e646e;
  --color-4: #8ba49f;
  --color-5: #c9dfc2;
}

SCSS

$color-1: #4a4040;
$color-2: #5d5055;
$color-3: #6e646e;
$color-4: #8ba49f;
$color-5: #c9dfc2;

TAILWIND

colors: {
  'brand-1': '#4a4040',
  'brand-2': '#5d5055',
  'brand-3': '#6e646e',
  'brand-4': '#8ba49f',
  'brand-5': '#c9dfc2',
}

RGB Array

[74, 64, 64], [93, 80, 85], [110, 100, 110], [139, 164, 159], [201, 223, 194]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4A4040, #5D5055, #6E646E, #8BA49F, #C9DFC2 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #4a4040; --color-2: #5d5055; --color-3: #6e646e; --color-4: #8ba49f; --color-5: #c9dfc2. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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