← Back to Editor

#FFDDCC · #D0A27A · #A16728 · #784646 · #3B2B2F

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

#FFDDCC

Apricot · Bisque · Peach Orange

HEX
#FFDDCC
RGB
rgb(255, 221, 204)
HSL
hsl(20, 100%, 90%)
HSB
hsb(20, 20%, 100%)
CMYK
cmyk(0%, 13%, 20%, 0%)
Oklch
oklch(92.1% 0.044 48.2)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

#D0A27A

Apricot · Tan · Warm Sun

HEX
#D0A27A
RGB
rgb(208, 162, 122)
HSL
hsl(28, 48%, 65%)
HSB
hsb(28, 41%, 82%)
CMYK
cmyk(0%, 22%, 41%, 18%)
Oklch
oklch(74.5% 0.077 62.2)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#A16728

Ochre · Sienna · Amber Brown

HEX
#A16728
RGB
rgb(161, 103, 40)
HSL
hsl(31, 60%, 39%)
HSB
hsb(31, 75%, 63%)
CMYK
cmyk(0%, 36%, 75%, 37%)
Oklch
oklch(56.5% 0.107 64.4)

TraditionalOchre」· PaintAmber Brown」· Creative Blush Sunrise

#784646

Crimson · Sienna · Wine Red

HEX
#784646
RGB
rgb(120, 70, 70)
HSL
hsl(0, 26%, 37%)
HSB
hsb(0, 42%, 47%)
CMYK
cmyk(0%, 42%, 42%, 53%)
Oklch
oklch(45.3% 0.069 20.1)

TraditionalCrimson」· PaintWine Red」· Creative Blush Sunrise

#3B2B2F

Crimson · DarkSlateGray · Deep Berry

HEX
#3B2B2F
RGB
rgb(59, 43, 47)
HSL
hsl(345, 16%, 20%)
HSB
hsb(345, 27%, 23%)
CMYK
cmyk(0%, 27%, 20%, 77%)
Oklch
oklch(30.9% 0.025 2.0)

TraditionalCrimson」· PaintDeep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFDDCC
CCEEFF

Analogous

FFCCD5
FFDDCC
FFF6CC

Triadic

FFDDCC
CCFFDD
DDCCFF

Split-Comp.

FFDDCC
CCFFF7
CCD4FF

Tetradic

FFDDCC
D5FFCC
CCEEFF
F6CCFF

Contrast Matrix WCAG 2.1 Contrast

FFDDCC
D0A27A
A16728
784646
3B2B2F
1.8
Fail
3.7
AA Large
6.0
AA
10.5
AAA
1.8
Fail
2.0
Fail
3.3
AA Large
5.8
AA
3.7
AA Large
2.0
Fail
1.6
Fail
2.9
Fail
6.0
AA
3.3
AA Large
1.6
Fail
1.8
Fail
10.5
AAA
5.8
AA
2.9
Fail
1.8
Fail
White BG
1.3Fail
2.3Fail
4.7AA
7.6AAA
13.4AAA
Black BG
16.5AAA
9.1AAA
4.5AA Large
2.8Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F0F0D0
BCBC84
888737
626246
34342E

Deuteranopia

F2F5D1
BFC286
8B903B
656946
35362E

Tritanopia

FDD3D4
CE8B8D
9E4346
764646
3A2D2D

Achromatopsia

E5E5E5
ABABAB
717171
555555
303030

Shades & Tints Shades & Tints

#FFDDCC

Dark
Light

#D0A27A

Dark
Light

#A16728

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffddcc;
  --color-2: #d0a27a;
  --color-3: #a16728;
  --color-4: #784646;
  --color-5: #3b2b2f;
}

SCSS

$color-1: #ffddcc;
$color-2: #d0a27a;
$color-3: #a16728;
$color-4: #784646;
$color-5: #3b2b2f;

TAILWIND

colors: {
  'brand-1': '#ffddcc',
  'brand-2': '#d0a27a',
  'brand-3': '#a16728',
  'brand-4': '#784646',
  'brand-5': '#3b2b2f',
}

RGB Array

[255, 221, 204], [208, 162, 122], [161, 103, 40], [120, 70, 70], [59, 43, 47]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFDDCC, #D0A27A, #A16728, #784646, #3B2B2F 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: #ffddcc; --color-2: #d0a27a; --color-3: #a16728; --color-4: #784646; --color-5: #3b2b2f. 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