← Back to Editor

#DDBFB1 · #E3A89E · #7B7066 · #504743 · #4A3B37

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

#DDBFB1

Apricot · Silver · Peach Orange

HEX
#DDBFB1
RGB
rgb(221, 191, 177)
HSL
hsl(19, 39%, 78%)
HSB
hsb(19, 20%, 87%)
CMYK
cmyk(0%, 14%, 20%, 13%)
Oklch
oklch(82.7% 0.039 46.5)

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

#E3A89E

Peach Pink · Tan · Coral Red

HEX
#E3A89E
RGB
rgb(227, 168, 158)
HSL
hsl(9, 55%, 75%)
HSB
hsb(9, 30%, 89%)
CMYK
cmyk(0%, 26%, 30%, 11%)
Oklch
oklch(78.4% 0.072 29.6)

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

#7B7066

Tangerine · DimGray · Warm Gray

HEX
#7B7066
RGB
rgb(123, 112, 102)
HSL
hsl(29, 9%, 44%)
HSB
hsb(29, 17%, 48%)
CMYK
cmyk(0%, 9%, 17%, 52%)
Oklch
oklch(55.2% 0.020 64.7)

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

#504743

Tangerine · DarkSlateGray · Charcoal

HEX
#504743
RGB
rgb(80, 71, 67)
HSL
hsl(18, 9%, 29%)
HSB
hsb(18, 16%, 31%)
CMYK
cmyk(0%, 11%, 16%, 69%)
Oklch
oklch(40.6% 0.014 45.5)

Traditional「Tangerine」· Paint「Charcoal」· Creative Midnight Shadow

#4A3B37

Crimson · DarkSlateGray · Wine Red

HEX
#4A3B37
RGB
rgb(74, 59, 55)
HSL
hsl(13, 15%, 25%)
HSB
hsb(13, 26%, 29%)
CMYK
cmyk(0%, 20%, 26%, 71%)
Oklch
oklch(36.7% 0.022 35.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DDBFB1
B1CFDD

Analogous

DDB1B9
DDBFB1
DDD5B1

Triadic

DDBFB1
B1DDBF
BFB1DD

Split-Comp.

DDBFB1
B1DDD5
B1B9DD

Tetradic

DDBFB1
B9DDB1
B1CFDD
D5B1DD

Contrast Matrix WCAG 2.1 Contrast

DDBFB1
E3A89E
7B7066
504743
4A3B37
—
1.2
Fail
2.8
Fail
5.2
AA
6.2
AA
1.2
Fail
—
2.4
Fail
4.5
AA Large
5.3
AA
2.8
Fail
2.4
Fail
—
1.9
Fail
2.2
Fail
5.2
AA
4.5
AA Large
1.9
Fail
—
1.2
Fail
6.2
AA
5.3
AA
2.2
Fail
1.2
Fail
—
White BG
1.7Fail
2.0Fail
4.8AA
9.0AAA
10.6AAA
Black BG
12.2AAA
10.4AAA
4.4AA Large
2.3Fail
2.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D0D0B4
C9C9A0
767668
4C4C44
444338

Deuteranopia

D2D4B5
CDD1A1
777869
4D4D44
444638

Tritanopia

DCB7B8
E0A2A3
7A6A6B
504545
493939

Achromatopsia

C6C6C6
B9B9B9
727272
494949
3F3F3F

Shades & Tints Shades & Tints

#DDBFB1

Dark
Light

#E3A89E

Dark
Light

#7B7066

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ddbfb1;
  --color-2: #e3a89e;
  --color-3: #7b7066;
  --color-4: #504743;
  --color-5: #4a3b37;
}

SCSS

$color-1: #ddbfb1;
$color-2: #e3a89e;
$color-3: #7b7066;
$color-4: #504743;
$color-5: #4a3b37;

TAILWIND

colors: {
  'brand-1': '#ddbfb1',
  'brand-2': '#e3a89e',
  'brand-3': '#7b7066',
  'brand-4': '#504743',
  'brand-5': '#4a3b37',
}

RGB Array

[221, 191, 177], [227, 168, 158], [123, 112, 102], [80, 71, 67], [74, 59, 55]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DDBFB1, #E3A89E, #7B7066, #504743, #4A3B37 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: #ddbfb1; --color-2: #e3a89e; --color-3: #7b7066; --color-4: #504743; --color-5: #4a3b37. 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