← Back to Editor

#383C3D · #46595E · #52706C · #779176 · #B6B886

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#383C3D

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#383C3D
RGB
rgb(56, 60, 61)
HSL
hsl(192, 4%, 23%)
HSB
hsb(192, 8%, 24%)
CMYK
cmyk(8%, 2%, 0%, 76%)
Oklch
oklch(35.3% 0.006 214.4)

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

#46595E

Slate Blue · DarkSlateGray · Mint Ice

HEX
#46595E
RGB
rgb(70, 89, 94)
HSL
hsl(193, 15%, 32%)
HSB
hsb(193, 26%, 37%)
CMYK
cmyk(26%, 5%, 0%, 63%)
Oklch
oklch(45.0% 0.025 215.5)

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

#52706C

Mineral Blue · DimGray · Mint Ice

HEX
#52706C
RGB
rgb(82, 112, 108)
HSL
hsl(172, 15%, 38%)
HSB
hsb(172, 27%, 44%)
CMYK
cmyk(27%, 0%, 4%, 56%)
Oklch
oklch(52.1% 0.035 186.0)

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

#779176

Celadon · Gray · Olive Green

HEX
#779176
RGB
rgb(119, 145, 118)
HSL
hsl(118, 11%, 52%)
HSB
hsb(118, 19%, 57%)
CMYK
cmyk(18%, 0%, 19%, 43%)
Oklch
oklch(62.9% 0.050 144.0)

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

#B6B886

Fresh Green · Tan · Sunflower

HEX
#B6B886
RGB
rgb(182, 184, 134)
HSL
hsl(62, 26%, 62%)
HSB
hsb(62, 27%, 72%)
CMYK
cmyk(1%, 0%, 27%, 28%)
Oklch
oklch(76.9% 0.067 109.8)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

383C3D
3D3938

Analogous

383D3C
383C3D
383A3D

Triadic

383C3D
3D383C
3C3D38

Split-Comp.

383C3D
3D383A
3D3C38

Tetradic

383C3D
3C383D
3D3938
3A3D38

Contrast Matrix WCAG 2.1 Contrast

383C3D
46595E
52706C
779176
B6B886
—
1.5
Fail
2.1
Fail
3.2
AA Large
5.4
AA
1.5
Fail
—
1.4
Fail
2.1
Fail
3.6
AA Large
2.1
Fail
1.4
Fail
—
1.6
Fail
2.6
Fail
3.2
AA Large
2.1
Fail
1.6
Fail
—
1.7
Fail
5.4
AA
3.6
AA Large
2.6
Fail
1.7
Fail
—
White BG
11.2AAA
7.4AAA
5.4AA
3.4AA Large
2.1Fail
Black BG
1.9Fail
2.9Fail
3.9AA Large
6.1AA
10.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3A3A3D
4E4E5D
5F5F6D
82827D
B7B792

Deuteranopia

3A393D
4D4C5D
5D5B6D
817F7E
B7B795

Tritanopia

383D3D
475C5C
536E6E
788283
B69C9E

Achromatopsia

3B3B3B
545454
676767
868686
B2B2B2

Shades & Tints Shades & Tints

#383C3D

Dark
Light

#46595E

Dark
Light

#52706C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #383c3d;
  --color-2: #46595e;
  --color-3: #52706c;
  --color-4: #779176;
  --color-5: #b6b886;
}

SCSS

$color-1: #383c3d;
$color-2: #46595e;
$color-3: #52706c;
$color-4: #779176;
$color-5: #b6b886;

TAILWIND

colors: {
  'brand-1': '#383c3d',
  'brand-2': '#46595e',
  'brand-3': '#52706c',
  'brand-4': '#779176',
  'brand-5': '#b6b886',
}

RGB Array

[56, 60, 61], [70, 89, 94], [82, 112, 108], [119, 145, 118], [182, 184, 134]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #383C3D, #46595E, #52706C, #779176, #B6B886 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: #383c3d; --color-2: #46595e; --color-3: #52706c; --color-4: #779176; --color-5: #b6b886. 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