← Back to Editor

#D5802B · #FEB535 · #ECDDAC · #8D95A7 · #5A6B84

muted

A 5-color muted palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D5802B

Ochre · Chocolate · Amber Brown

HEX
#D5802B
RGB
rgb(213, 128, 43)
HSL
hsl(30, 67%, 50%)
HSB
hsb(30, 80%, 84%)
CMYK
cmyk(0%, 40%, 80%, 16%)
Oklch
oklch(67.7% 0.141 60.6)

TraditionalOchre」· PaintAmber Brown」· Creative Blush Sunrise

#FEB535

Ginger · GoldenRod · Warm Sun

HEX
#FEB535
RGB
rgb(254, 181, 53)
HSL
hsl(38, 99%, 60%)
HSB
hsb(38, 79%, 100%)
CMYK
cmyk(0%, 29%, 79%, 0%)
Oklch
oklch(82.2% 0.157 76.3)

TraditionalGinger」· PaintWarm Sun」· Creative Blush Sunrise

#ECDDAC

Goose Yellow · Wheat · Lemon Cream

HEX
#ECDDAC
RGB
rgb(236, 221, 172)
HSL
hsl(46, 63%, 80%)
HSB
hsb(46, 27%, 93%)
CMYK
cmyk(0%, 6%, 27%, 7%)
Oklch
oklch(89.8% 0.066 93.1)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#8D95A7

Azure · LightSlateGray · Navy Blue

HEX
#8D95A7
RGB
rgb(141, 149, 167)
HSL
hsl(222, 13%, 60%)
HSB
hsb(222, 16%, 65%)
CMYK
cmyk(16%, 11%, 0%, 35%)
Oklch
oklch(66.9% 0.028 266.5)

TraditionalAzure」· PaintNavy Blue」· Creative Blush Sunrise

#5A6B84

Indigo · DimGray · Navy Blue

HEX
#5A6B84
RGB
rgb(90, 107, 132)
HSL
hsl(216, 19%, 44%)
HSB
hsb(216, 32%, 52%)
CMYK
cmyk(32%, 19%, 0%, 48%)
Oklch
oklch(52.3% 0.045 257.9)

TraditionalIndigo」· PaintNavy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5802B
2A80D5

Analogous

D52A2A
D5802B
D5D52A

Triadic

D5802B
2AD580
802AD5

Split-Comp.

D5802B
2AD5D5
2A2AD5

Tetradic

D5802B
2AD52A
2A80D5
D52AD5

Contrast Matrix WCAG 2.1 Contrast

D5802B
FEB535
ECDDAC
8D95A7
5A6B84
1.7
Fail
2.2
Fail
1.0
Fail
1.8
Fail
1.7
Fail
1.3
Fail
1.7
Fail
3.1
AA Large
2.2
Fail
1.3
Fail
2.2
Fail
4.0
AA Large
1.0
Fail
1.7
Fail
2.2
Fail
1.8
Fail
1.8
Fail
3.1
AA Large
4.0
AA Large
1.8
Fail
White BG
3.0AA Large
1.8Fail
1.4Fail
3.0AA Large
5.4AA
Black BG
7.0AA
11.9AAA
15.5AAA
7.0AA
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B0AF40
DEDE54
E6E5B8
9091A3
61627E

Deuteranopia

B5BC45
E3E85B
E6E8BB
908FA2
605F7D

Tritanopia

D15053
FA6C72
EBC1C3
8D9F9E
5B7978

Achromatopsia

909090
BCBCBC
DCDCDC
959595
696969

Shades & Tints Shades & Tints

#D5802B

Dark
Light

#FEB535

Dark
Light

#ECDDAC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5802b;
  --color-2: #feb535;
  --color-3: #ecddac;
  --color-4: #8d95a7;
  --color-5: #5a6b84;
}

SCSS

$color-1: #d5802b;
$color-2: #feb535;
$color-3: #ecddac;
$color-4: #8d95a7;
$color-5: #5a6b84;

TAILWIND

colors: {
  'brand-1': '#d5802b',
  'brand-2': '#feb535',
  'brand-3': '#ecddac',
  'brand-4': '#8d95a7',
  'brand-5': '#5a6b84',
}

RGB Array

[213, 128, 43], [254, 181, 53], [236, 221, 172], [141, 149, 167], [90, 107, 132]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This muted-style palette of #D5802B, #FEB535, #ECDDAC, #8D95A7, #5A6B84 is ideal for: corporate websites, product showcases, portfolios. 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: #d5802b; --color-2: #feb535; --color-3: #ecddac; --color-4: #8d95a7; --color-5: #5a6b84. 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. 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 muted-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