← Back to Editor

#DBC3AB · #795F60 · #BF9F86 · #683136 · #331F21

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

#DBC3AB

Goose Yellow · Silver · Peach Orange

HEX
#DBC3AB
RGB
rgb(219, 195, 171)
HSL
hsl(30, 40%, 76%)
HSB
hsb(30, 22%, 86%)
CMYK
cmyk(0%, 11%, 22%, 14%)
Oklch
oklch(83.1% 0.042 67.2)

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

#795F60

Crimson · DimGray · Passion Red

HEX
#795F60
RGB
rgb(121, 95, 96)
HSL
hsl(358, 12%, 42%)
HSB
hsb(358, 21%, 47%)
CMYK
cmyk(0%, 21%, 21%, 53%)
Oklch
oklch(51.2% 0.034 15.7)

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

#BF9F86

Apricot · Tan · Warm Sun

HEX
#BF9F86
RGB
rgb(191, 159, 134)
HSL
hsl(26, 31%, 64%)
HSB
hsb(26, 30%, 75%)
CMYK
cmyk(0%, 17%, 30%, 25%)
Oklch
oklch(72.5% 0.052 59.8)

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

#683136

Crimson · DarkOliveGreen · Wine Red

HEX
#683136
RGB
rgb(104, 49, 54)
HSL
hsl(355, 36%, 30%)
HSB
hsb(355, 53%, 41%)
CMYK
cmyk(0%, 53%, 48%, 59%)
Oklch
oklch(38.8% 0.079 15.8)

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

#331F21

Crimson · DarkSlateGray · Deep Berry

HEX
#331F21
RGB
rgb(51, 31, 33)
HSL
hsl(354, 24%, 16%)
HSB
hsb(354, 39%, 20%)
CMYK
cmyk(0%, 39%, 35%, 80%)
Oklch
oklch(26.6% 0.031 12.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DBC3AB
A9C2DA

Analogous

DAA9A9
DBC3AB
DADAA9

Triadic

DBC3AB
A9DAC2
C2A9DA

Split-Comp.

DBC3AB
A9DADA
A9A9DA

Tetradic

DBC3AB
A9DAA9
A9C2DA
DAA9DA

Contrast Matrix WCAG 2.1 Contrast

DBC3AB
795F60
BF9F86
683136
331F21
—
3.4
AA Large
1.5
Fail
6.0
AA
9.1
AAA
3.4
AA Large
—
2.4
Fail
1.7
Fail
2.7
Fail
1.5
Fail
2.4
Fail
—
4.1
AA Large
6.3
AA
6.0
AA
1.7
Fail
4.1
AA Large
—
1.5
Fail
9.1
AAA
2.7
Fail
6.3
AA
1.5
Fail
—
White BG
1.7Fail
5.8AA
2.5Fail
10.1AAA
15.5AAA
Black BG
12.4AAA
3.6AA Large
8.5AAA
2.1Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D1D0B1
6E6E60
B1B18C
505035
2A2A21

Deuteranopia

D2D4B2
6F7160
B3B58E
535835
2C2D20

Tritanopia

DAB5B6
786060
BD9192
653434
322020

Achromatopsia

C7C7C7
676767
A6A6A6
424242
252525

Shades & Tints Shades & Tints

#DBC3AB

Dark
Light

#795F60

Dark
Light

#BF9F86

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dbc3ab;
  --color-2: #795f60;
  --color-3: #bf9f86;
  --color-4: #683136;
  --color-5: #331f21;
}

SCSS

$color-1: #dbc3ab;
$color-2: #795f60;
$color-3: #bf9f86;
$color-4: #683136;
$color-5: #331f21;

TAILWIND

colors: {
  'brand-1': '#dbc3ab',
  'brand-2': '#795f60',
  'brand-3': '#bf9f86',
  'brand-4': '#683136',
  'brand-5': '#331f21',
}

RGB Array

[219, 195, 171], [121, 95, 96], [191, 159, 134], [104, 49, 54], [51, 31, 33]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DBC3AB, #795F60, #BF9F86, #683136, #331F21 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: #dbc3ab; --color-2: #795f60; --color-3: #bf9f86; --color-4: #683136; --color-5: #331f21. 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