← Back to Editor

#494A48 · #727471 · #CFC6C6 · #F1DED4 · #DDE082

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

Color Details Color Details

#494A48

Dark Cyan · DarkSlateGray · Charcoal

HEX
#494A48
RGB
rgb(73, 74, 72)
HSL
hsl(90, 1%, 29%)
HSB
hsb(90, 3%, 29%)
CMYK
cmyk(1%, 0%, 3%, 71%)
Oklch
oklch(40.7% 0.004 128.6)

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

#727471

Ink Gray · DimGray · Warm Gray

HEX
#727471
RGB
rgb(114, 116, 113)
HSL
hsl(100, 1%, 45%)
HSB
hsb(100, 3%, 45%)
CMYK
cmyk(2%, 0%, 3%, 55%)
Oklch
oklch(55.6% 0.005 134.9)

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

#CFC6C6

Peach Pink · Silver · Pearl Gray

HEX
#CFC6C6
RGB
rgb(207, 198, 198)
HSL
hsl(0, 9%, 79%)
HSB
hsb(0, 4%, 81%)
CMYK
cmyk(0%, 4%, 4%, 19%)
Oklch
oklch(83.4% 0.010 17.4)

Traditional「Peach Pink」· Paint「Pearl Gray」· Creative Silver Lining

#F1DED4

Apricot · Bisque · Peach Orange

HEX
#F1DED4
RGB
rgb(241, 222, 212)
HSL
hsl(21, 51%, 89%)
HSB
hsb(21, 12%, 95%)
CMYK
cmyk(0%, 8%, 12%, 5%)
Oklch
oklch(91.3% 0.025 49.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#DDE082

Fresh Green · Khaki · Sunflower

HEX
#DDE082
RGB
rgb(221, 224, 130)
HSL
hsl(62, 60%, 69%)
HSB
hsb(62, 42%, 88%)
CMYK
cmyk(1%, 0%, 42%, 12%)
Oklch
oklch(88.4% 0.117 110.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

494A48
4A494B

Analogous

4B4B49
494A48
494B49

Triadic

494A48
494A4B
4B494A

Split-Comp.

494A48
49494B
4B494B

Tetradic

494A48
494B4B
4A494B
4B4949

Contrast Matrix WCAG 2.1 Contrast

494A48
727471
CFC6C6
F1DED4
DDE082
—
1.9
Fail
5.3
AA
6.8
AA
6.4
AA
1.9
Fail
—
2.8
Fail
3.6
AA Large
3.4
AA Large
5.3
AA
2.8
Fail
—
1.3
Fail
1.2
Fail
6.8
AA
3.6
AA Large
1.3
Fail
—
1.1
Fail
6.4
AA
3.4
AA Large
1.2
Fail
1.1
Fail
—
White BG
8.9AAA
4.7AA
1.7Fail
1.3Fail
1.4Fail
Black BG
2.4Fail
4.5AA Large
12.5AAA
16.1AAA
15.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

494948
737372
CBCBC6
E9E9D6
DEDE99

Deuteranopia

494949
737372
CCCCC6
EAEBD7
DEDE9E

Tritanopia

494949
727272
CFC6C6
F0D8D9
DDABAF

Achromatopsia

494949
737373
C9C9C9
E3E3E3
D4D4D4

Shades & Tints Shades & Tints

#494A48

Dark
Light

#727471

Dark
Light

#CFC6C6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #494a48;
  --color-2: #727471;
  --color-3: #cfc6c6;
  --color-4: #f1ded4;
  --color-5: #dde082;
}

SCSS

$color-1: #494a48;
$color-2: #727471;
$color-3: #cfc6c6;
$color-4: #f1ded4;
$color-5: #dde082;

TAILWIND

colors: {
  'brand-1': '#494a48',
  'brand-2': '#727471',
  'brand-3': '#cfc6c6',
  'brand-4': '#f1ded4',
  'brand-5': '#dde082',
}

RGB Array

[73, 74, 72], [114, 116, 113], [207, 198, 198], [241, 222, 212], [221, 224, 130]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #494A48, #727471, #CFC6C6, #F1DED4, #DDE082 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: #494a48; --color-2: #727471; --color-3: #cfc6c6; --color-4: #f1ded4; --color-5: #dde082. 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