← Back to Editor

#E47410 · #D5513E · #B4595D · #7B545B · #514651

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 Library

Color Details Color Details

#E47410

Tangerine · Chocolate · Amber Brown

HEX
#E47410
RGB
rgb(228, 116, 16)
HSL
hsl(28, 87%, 48%)
HSB
hsb(28, 93%, 89%)
CMYK
cmyk(0%, 49%, 93%, 11%)
Oklch
oklch(67.6% 0.167 53.0)

TraditionalTangerine」· PaintAmber Brown」· Creative Blush Sunrise

#D5513E

Vermilion · Chocolate · Passion Red

HEX
#D5513E
RGB
rgb(213, 81, 62)
HSL
hsl(8, 64%, 54%)
HSB
hsb(8, 71%, 84%)
CMYK
cmyk(0%, 62%, 71%, 16%)
Oklch
oklch(60.8% 0.170 30.8)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

#B4595D

Crimson · Sienna · Passion Red

HEX
#B4595D
RGB
rgb(180, 89, 93)
HSL
hsl(357, 38%, 53%)
HSB
hsb(357, 51%, 71%)
CMYK
cmyk(0%, 51%, 48%, 29%)
Oklch
oklch(57.5% 0.118 18.8)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#7B545B

Crimson · DimGray · Passion Red

HEX
#7B545B
RGB
rgb(123, 84, 91)
HSL
hsl(349, 19%, 41%)
HSB
hsb(349, 32%, 48%)
CMYK
cmyk(0%, 32%, 26%, 52%)
Oklch
oklch(49.0% 0.053 7.4)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#514651

Dark Cyan · DarkSlateGray · Charcoal

HEX
#514651
RGB
rgb(81, 70, 81)
HSL
hsl(300, 7%, 30%)
HSB
hsb(300, 14%, 32%)
CMYK
cmyk(0%, 14%, 0%, 68%)
Oklch
oklch(40.9% 0.023 326.0)

TraditionalDark Cyan」· PaintCharcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E47410
1081E5

Analogous

E51017
E47410
E5DE10

Triadic

E47410
10E573
7310E5

Split-Comp.

E47410
10E5DE
1017E5

Tetradic

E47410
17E510
1081E5
DE10E5

Contrast Matrix WCAG 2.1 Contrast

E47410
D5513E
B4595D
7B545B
514651
1.3
Fail
1.5
Fail
2.1
Fail
2.9
Fail
1.3
Fail
1.1
Fail
1.6
Fail
2.2
Fail
1.5
Fail
1.1
Fail
1.4
Fail
1.9
Fail
2.1
Fail
1.6
Fail
1.4
Fail
1.4
Fail
2.9
Fail
2.2
Fail
1.9
Fail
1.4
Fail
White BG
3.1AA Large
4.1AA Large
4.6AA
6.4AA
9.0AAA
Black BG
6.8AA
5.1AA
4.5AA
3.3AA Large
2.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B228
9C9B43
8D8C5C
6A6A59
4C4C4E

Deuteranopia

BAC22E
A4AD44
92995C
6C6F59
4D4E4E

Tritanopia

DE3B3F
CE4647
AF5B5B
795858
504C4C

Achromatopsia

8A8A8A
767676
757575
606060
4B4B4B

Shades & Tints Shades & Tints

#E47410

Dark
Light

#D5513E

Dark
Light

#B4595D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e47410;
  --color-2: #d5513e;
  --color-3: #b4595d;
  --color-4: #7b545b;
  --color-5: #514651;
}

SCSS

$color-1: #e47410;
$color-2: #d5513e;
$color-3: #b4595d;
$color-4: #7b545b;
$color-5: #514651;

TAILWIND

colors: {
  'brand-1': '#e47410',
  'brand-2': '#d5513e',
  'brand-3': '#b4595d',
  'brand-4': '#7b545b',
  'brand-5': '#514651',
}

RGB Array

[228, 116, 16], [213, 81, 62], [180, 89, 93], [123, 84, 91], [81, 70, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E47410, #D5513E, #B4595D, #7B545B, #514651 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: #e47410; --color-2: #d5513e; --color-3: #b4595d; --color-4: #7b545b; --color-5: #514651. 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 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