← Back to Editor

#464F47 · #5D6663 · #A17B60 · #B3A05F · #B8B28D

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

#464F47

Dark Cyan · DarkSlateGray · Charcoal

HEX
#464F47
RGB
rgb(70, 79, 71)
HSL
hsl(127, 6%, 29%)
HSB
hsb(127, 11%, 31%)
CMYK
cmyk(11%, 0%, 10%, 69%)
Oklch
oklch(41.7% 0.017 148.5)

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

#5D6663

Ink Gray · DimGray · Charcoal

HEX
#5D6663
RGB
rgb(93, 102, 99)
HSL
hsl(160, 5%, 38%)
HSB
hsb(160, 9%, 40%)
CMYK
cmyk(9%, 0%, 3%, 60%)
Oklch
oklch(50.2% 0.012 173.9)

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

#A17B60

Tangerine · Gray · Amber Brown

HEX
#A17B60
RGB
rgb(161, 123, 96)
HSL
hsl(25, 26%, 50%)
HSB
hsb(25, 40%, 63%)
CMYK
cmyk(0%, 24%, 40%, 37%)
Oklch
oklch(61.3% 0.061 56.7)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#B3A05F

Ginger · Tan · Sunflower

HEX
#B3A05F
RGB
rgb(179, 160, 95)
HSL
hsl(46, 36%, 54%)
HSB
hsb(46, 47%, 70%)
CMYK
cmyk(0%, 11%, 47%, 30%)
Oklch
oklch(70.8% 0.088 93.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#B8B28D

Fresh Green · Tan · Sunflower

HEX
#B8B28D
RGB
rgb(184, 178, 141)
HSL
hsl(52, 23%, 64%)
HSB
hsb(52, 23%, 72%)
CMYK
cmyk(0%, 3%, 23%, 28%)
Oklch
oklch(75.9% 0.051 99.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

464F47
4E464D

Analogous

494E46
464F47
464E4B

Triadic

464F47
47464E
4E4746

Split-Comp.

464F47
4B464E
4E4649

Tetradic

464F47
46494E
4E464D
4E4B46

Contrast Matrix WCAG 2.1 Contrast

464F47
5D6663
A17B60
B3A05F
B8B28D
—
1.4
Fail
2.2
Fail
3.3
AA Large
4.0
AA Large
1.4
Fail
—
1.6
Fail
2.3
Fail
2.8
Fail
2.2
Fail
1.6
Fail
—
1.5
Fail
1.8
Fail
3.3
AA Large
2.3
Fail
1.5
Fail
—
1.2
Fail
4.0
AA Large
2.8
Fail
1.8
Fail
1.2
Fail
—
White BG
8.5AAA
5.9AA
3.8AA Large
2.6Fail
2.1Fail
Black BG
2.5Fail
3.5AA Large
5.5AA
8.1AAA
9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4A4A49
616164
919067
ABAB6F
B5B596

Deuteranopia

494949
606064
939668
ACAD73
B6B698

Tritanopia

464A4B
5D6464
9F6C6D
B27B7E
B89D9F

Achromatopsia

4B4B4B
636363
838383
9E9E9E
B0B0B0

Shades & Tints Shades & Tints

#464F47

Dark
Light

#5D6663

Dark
Light

#A17B60

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #464f47;
  --color-2: #5d6663;
  --color-3: #a17b60;
  --color-4: #b3a05f;
  --color-5: #b8b28d;
}

SCSS

$color-1: #464f47;
$color-2: #5d6663;
$color-3: #a17b60;
$color-4: #b3a05f;
$color-5: #b8b28d;

TAILWIND

colors: {
  'brand-1': '#464f47',
  'brand-2': '#5d6663',
  'brand-3': '#a17b60',
  'brand-4': '#b3a05f',
  'brand-5': '#b8b28d',
}

RGB Array

[70, 79, 71], [93, 102, 99], [161, 123, 96], [179, 160, 95], [184, 178, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #464F47, #5D6663, #A17B60, #B3A05F, #B8B28D 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: #464f47; --color-2: #5d6663; --color-3: #a17b60; --color-4: #b3a05f; --color-5: #b8b28d. 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