← Back to Editor

#706464 · #928684 · #ADA09B · #C5B8B0 · #D8CEC4

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#706464

Ink Gray · DimGray · Warm Gray

HEX
#706464
RGB
rgb(112, 100, 100)
HSL
hsl(0, 6%, 42%)
HSB
hsb(0, 11%, 44%)
CMYK
cmyk(0%, 11%, 11%, 56%)
Oklch
oklch(51.5% 0.015 17.7)

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

#928684

Ash · Gray · Warm Gray

HEX
#928684
RGB
rgb(146, 134, 132)
HSL
hsl(9, 6%, 55%)
HSB
hsb(9, 10%, 57%)
CMYK
cmyk(0%, 8%, 10%, 43%)
Oklch
oklch(63.0% 0.015 28.9)

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

#ADA09B

Apricot · DarkGray · Warm Sun

HEX
#ADA09B
RGB
rgb(173, 160, 155)
HSL
hsl(17, 10%, 64%)
HSB
hsb(17, 10%, 68%)
CMYK
cmyk(0%, 8%, 10%, 32%)
Oklch
oklch(71.5% 0.017 42.3)

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

#C5B8B0

Apricot · Silver · Warm Sun

HEX
#C5B8B0
RGB
rgb(197, 184, 176)
HSL
hsl(23, 15%, 73%)
HSB
hsb(23, 11%, 77%)
CMYK
cmyk(0%, 7%, 11%, 23%)
Oklch
oklch(79.1% 0.019 53.9)

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

#D8CEC4

Goose Yellow · LightGray · Peach Orange

HEX
#D8CEC4
RGB
rgb(216, 206, 196)
HSL
hsl(30, 20%, 81%)
HSB
hsb(30, 9%, 85%)
CMYK
cmyk(0%, 5%, 9%, 15%)
Oklch
oklch(85.7% 0.018 67.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

706464
657272

Analogous

72656B
706464
726B65

Triadic

706464
657265
656572

Split-Comp.

706464
65726B
656B72

Tetradic

706464
6B7265
657272
6B6572

Contrast Matrix WCAG 2.1 Contrast

706464
928684
ADA09B
C5B8B0
D8CEC4
—
1.6
Fail
2.2
Fail
2.9
Fail
3.7
AA Large
1.6
Fail
—
1.4
Fail
1.8
Fail
2.3
Fail
2.2
Fail
1.4
Fail
—
1.3
Fail
1.6
Fail
2.9
Fail
1.8
Fail
1.3
Fail
—
1.2
Fail
3.7
AA Large
2.3
Fail
1.6
Fail
1.2
Fail
—
White BG
5.7AA
3.5AA Large
2.5Fail
1.9Fail
1.6Fail
Black BG
3.7AA Large
6.0AA
8.3AAA
10.9AAA
13.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6B6B64
8D8D84
A7A79C
BFBFB2
D4D4C6

Deuteranopia

6C6C64
8E8E85
A8A99D
C0C1B2
D4D5C7

Tritanopia

6F6464
918585
AC9D9D
C4B3B4
D8C8C9

Achromatopsia

686868
898989
A3A3A3
BBBBBB
D0D0D0

Shades & Tints Shades & Tints

#706464

Dark
Light

#928684

Dark
Light

#ADA09B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #706464;
  --color-2: #928684;
  --color-3: #ada09b;
  --color-4: #c5b8b0;
  --color-5: #d8cec4;
}

SCSS

$color-1: #706464;
$color-2: #928684;
$color-3: #ada09b;
$color-4: #c5b8b0;
$color-5: #d8cec4;

TAILWIND

colors: {
  'brand-1': '#706464',
  'brand-2': '#928684',
  'brand-3': '#ada09b',
  'brand-4': '#c5b8b0',
  'brand-5': '#d8cec4',
}

RGB Array

[112, 100, 100], [146, 134, 132], [173, 160, 155], [197, 184, 176], [216, 206, 196]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #706464, #928684, #ADA09B, #C5B8B0, #D8CEC4 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: #706464; --color-2: #928684; --color-3: #ada09b; --color-4: #c5b8b0; --color-5: #d8cec4. 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