← Back to Editor

#999B96 · #A5A299 · #728687 · #696B68 · #5E544A

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

#999B96

Ash · DarkGray · Silver Sand

HEX
#999B96
RGB
rgb(153, 155, 150)
HSL
hsl(84, 2%, 60%)
HSB
hsb(84, 3%, 61%)
CMYK
cmyk(1%, 0%, 3%, 39%)
Oklch
oklch(68.6% 0.008 124.5)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#A5A299

Ash · DarkGray · Silver Sand

HEX
#A5A299
RGB
rgb(165, 162, 153)
HSL
hsl(45, 6%, 62%)
HSB
hsb(45, 7%, 65%)
CMYK
cmyk(0%, 2%, 7%, 35%)
Oklch
oklch(71.2% 0.013 91.6)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#728687

Slate Blue · SlateGray · Warm Gray

HEX
#728687
RGB
rgb(114, 134, 135)
HSL
hsl(183, 8%, 49%)
HSB
hsb(183, 16%, 53%)
CMYK
cmyk(16%, 1%, 0%, 47%)
Oklch
oklch(60.4% 0.023 200.3)

Traditional「Slate Blue」· Paint「Warm Gray」· Creative Urban Concrete

#696B68

Ink Gray · DimGray · Warm Gray

HEX
#696B68
RGB
rgb(105, 107, 104)
HSL
hsl(100, 1%, 41%)
HSB
hsb(100, 3%, 42%)
CMYK
cmyk(2%, 0%, 3%, 58%)
Oklch
oklch(52.5% 0.005 134.9)

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

#5E544A

Ochre · DarkOliveGreen · Amber Brown

HEX
#5E544A
RGB
rgb(94, 84, 74)
HSL
hsl(30, 12%, 33%)
HSB
hsb(30, 21%, 37%)
CMYK
cmyk(0%, 11%, 21%, 63%)
Oklch
oklch(45.3% 0.021 67.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

999B96
99979B

Analogous

9B9B97
999B96
979B97

Triadic

999B96
97999B
9B9799

Split-Comp.

999B96
97979B
9B979B

Tetradic

999B96
979B9B
99979B
9B9797

Contrast Matrix WCAG 2.1 Contrast

999B96
A5A299
728687
696B68
5E544A
—
1.1
Fail
1.4
Fail
1.9
Fail
2.6
Fail
1.1
Fail
—
1.5
Fail
2.1
Fail
2.9
Fail
1.4
Fail
1.5
Fail
—
1.4
Fail
1.9
Fail
1.9
Fail
2.1
Fail
1.4
Fail
—
1.4
Fail
2.6
Fail
2.9
Fail
1.9
Fail
1.4
Fail
—
White BG
2.8Fail
2.6Fail
3.8AA Large
5.4AA
7.4AAA
Black BG
7.5AAA
8.2AAA
5.5AA
3.9AA Large
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

9A9A97
A4A49B
7B7B87
6A6A69
5A5A4C

Deuteranopia

9A9A98
A4A49C
7A7887
6A6A69
5A5B4D

Tritanopia

999898
A59D9D
738787
696969
5E4E4F

Achromatopsia

9A9A9A
A2A2A2
808080
6A6A6A
565656

Shades & Tints Shades & Tints

#999B96

Dark
Light

#A5A299

Dark
Light

#728687

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #999b96;
  --color-2: #a5a299;
  --color-3: #728687;
  --color-4: #696b68;
  --color-5: #5e544a;
}

SCSS

$color-1: #999b96;
$color-2: #a5a299;
$color-3: #728687;
$color-4: #696b68;
$color-5: #5e544a;

TAILWIND

colors: {
  'brand-1': '#999b96',
  'brand-2': '#a5a299',
  'brand-3': '#728687',
  'brand-4': '#696b68',
  'brand-5': '#5e544a',
}

RGB Array

[153, 155, 150], [165, 162, 153], [114, 134, 135], [105, 107, 104], [94, 84, 74]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #999B96, #A5A299, #728687, #696B68, #5E544A 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: #999b96; --color-2: #a5a299; --color-3: #728687; --color-4: #696b68; --color-5: #5e544a. 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