← Back to Editor

#483A40 · #794957 · #A76A6A · #D2A097 · #F0D8BF

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

#483A40

Dark Violet · DarkSlateGray · Raspberry

HEX
#483A40
RGB
rgb(72, 58, 64)
HSL
hsl(334, 11%, 25%)
HSB
hsb(334, 19%, 28%)
CMYK
cmyk(0%, 19%, 11%, 72%)
Oklch
oklch(36.6% 0.022 350.6)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#794957

Dark Violet · DimGray · Camellia

HEX
#794957
RGB
rgb(121, 73, 87)
HSL
hsl(343, 25%, 38%)
HSB
hsb(343, 40%, 47%)
CMYK
cmyk(0%, 40%, 28%, 53%)
Oklch
oklch(46.5% 0.068 1.2)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#A76A6A

Crimson · Gray · Passion Red

HEX
#A76A6A
RGB
rgb(167, 106, 106)
HSL
hsl(0, 26%, 54%)
HSB
hsb(0, 37%, 65%)
CMYK
cmyk(0%, 37%, 37%, 35%)
Oklch
oklch(59.0% 0.079 19.7)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#D2A097

Peach Pink · Tan · Coral Red

HEX
#D2A097
RGB
rgb(210, 160, 151)
HSL
hsl(9, 40%, 71%)
HSB
hsb(9, 28%, 82%)
CMYK
cmyk(0%, 24%, 28%, 18%)
Oklch
oklch(75.0% 0.061 30.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F0D8BF

Goose Yellow · Wheat · Peach Orange

HEX
#F0D8BF
RGB
rgb(240, 216, 191)
HSL
hsl(31, 62%, 85%)
HSB
hsb(31, 20%, 94%)
CMYK
cmyk(0%, 10%, 20%, 6%)
Oklch
oklch(89.5% 0.043 68.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

483A40
394741

Analogous

473946
483A40
473A39

Triadic

483A40
3F4739
393F47

Split-Comp.

483A40
39473A
394647

Tetradic

483A40
464739
394741
3A3947

Contrast Matrix WCAG 2.1 Contrast

483A40
794957
A76A6A
D2A097
F0D8BF
—
1.5
Fail
2.5
Fail
4.7
AA
7.8
AAA
1.5
Fail
—
1.7
Fail
3.2
AA Large
5.3
AA
2.5
Fail
1.7
Fail
—
1.9
Fail
3.1
AA Large
4.7
AA
3.2
AA Large
1.9
Fail
—
1.7
Fail
7.8
AAA
5.3
AA
3.1
AA Large
1.7
Fail
—
White BG
10.7AAA
7.2AAA
4.3AA Large
2.3Fail
1.4Fail
Black BG
2.0Fail
2.9Fail
4.9AA
9.2AAA
15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

42423F
646454
8D8C6A
BCBC99
E6E5C5

Deuteranopia

43443E
676B53
90956A
BFC39A
E7E9C7

Tritanopia

473D3D
775150
A46A6A
D09B9B
EFCACB

Achromatopsia

3F3F3F
595959
7C7C7C
AEAEAE
DCDCDC

Shades & Tints Shades & Tints

#483A40

Dark
Light

#794957

Dark
Light

#A76A6A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #483a40;
  --color-2: #794957;
  --color-3: #a76a6a;
  --color-4: #d2a097;
  --color-5: #f0d8bf;
}

SCSS

$color-1: #483a40;
$color-2: #794957;
$color-3: #a76a6a;
$color-4: #d2a097;
$color-5: #f0d8bf;

TAILWIND

colors: {
  'brand-1': '#483a40',
  'brand-2': '#794957',
  'brand-3': '#a76a6a',
  'brand-4': '#d2a097',
  'brand-5': '#f0d8bf',
}

RGB Array

[72, 58, 64], [121, 73, 87], [167, 106, 106], [210, 160, 151], [240, 216, 191]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #483A40, #794957, #A76A6A, #D2A097, #F0D8BF is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #483a40; --color-2: #794957; --color-3: #a76a6a; --color-4: #d2a097; --color-5: #f0d8bf. 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. 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