← Back to Editor

#EC463C · #DA5846 · #D1614A · #C76B4F · #A29061

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

#EC463C

Vermilion · Tomato · Passion Red

HEX
#EC463C
RGB
rgb(236, 70, 60)
HSL
hsl(3, 82%, 58%)
HSB
hsb(3, 75%, 93%)
CMYK
cmyk(0%, 70%, 75%, 7%)
Oklch
oklch(63.3% 0.204 27.9)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

#DA5846

Vermilion · Tomato · Passion Red

HEX
#DA5846
RGB
rgb(218, 88, 70)
HSL
hsl(7, 67%, 56%)
HSB
hsb(7, 68%, 85%)
CMYK
cmyk(0%, 60%, 68%, 15%)
Oklch
oklch(62.6% 0.167 30.3)

TraditionalVermilion」· PaintPassion Red」· Creative Blush Sunrise

#D1614A

Crimson · Chocolate · Passion Red

HEX
#D1614A
RGB
rgb(209, 97, 74)
HSL
hsl(10, 59%, 55%)
HSB
hsb(10, 65%, 82%)
CMYK
cmyk(0%, 54%, 65%, 18%)
Oklch
oklch(62.5% 0.147 33.1)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#C76B4F

Crimson · Chocolate · Passion Red

HEX
#C76B4F
RGB
rgb(199, 107, 79)
HSL
hsl(14, 52%, 55%)
HSB
hsb(14, 60%, 78%)
CMYK
cmyk(0%, 46%, 60%, 22%)
Oklch
oklch(62.7% 0.124 37.7)

TraditionalCrimson」· PaintPassion Red」· Creative Blush Sunrise

#A29061

Ginger · Gray · Sunflower

HEX
#A29061
RGB
rgb(162, 144, 97)
HSL
hsl(43, 26%, 51%)
HSB
hsb(43, 40%, 64%)
CMYK
cmyk(0%, 11%, 40%, 36%)
Oklch
oklch(65.8% 0.068 89.4)

TraditionalGinger」· PaintSunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EC463C
3CE3EC

Analogous

EC3C8B
EC463C
EC9D3C

Triadic

EC463C
3CEC45
453CEC

Split-Comp.

EC463C
3CEC9D
3C8BEC

Tetradic

EC463C
8BEC3C
3CE3EC
9D3CEC

Contrast Matrix WCAG 2.1 Contrast

EC463C
DA5846
D1614A
C76B4F
A29061
1.0
Fail
1.0
Fail
1.0
Fail
1.2
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.2
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.2
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.2
Fail
1.2
Fail
1.2
Fail
1.2
Fail
1.2
Fail
White BG
3.8AA Large
3.8AA Large
3.8AA Large
3.7AA Large
3.1AA Large
Black BG
5.5AA
5.5AA
5.5AA
5.6AA
6.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A33E
A2A14A
A19F50
9F9E56
9A9A6C

Deuteranopia

AEBA3F
A9B34B
A7AF51
A5AB57
9B9D6F

Tritanopia

E44041
D44E4F
CB5455
C25B5C
A17577

Achromatopsia

767676
7D7D7D
808080
838383
909090

Shades & Tints Shades & Tints

#EC463C

Dark
Light

#DA5846

Dark
Light

#D1614A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ec463c;
  --color-2: #da5846;
  --color-3: #d1614a;
  --color-4: #c76b4f;
  --color-5: #a29061;
}

SCSS

$color-1: #ec463c;
$color-2: #da5846;
$color-3: #d1614a;
$color-4: #c76b4f;
$color-5: #a29061;

TAILWIND

colors: {
  'brand-1': '#ec463c',
  'brand-2': '#da5846',
  'brand-3': '#d1614a',
  'brand-4': '#c76b4f',
  'brand-5': '#a29061',
}

RGB Array

[236, 70, 60], [218, 88, 70], [209, 97, 74], [199, 107, 79], [162, 144, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EC463C, #DA5846, #D1614A, #C76B4F, #A29061 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: #ec463c; --color-2: #da5846; --color-3: #d1614a; --color-4: #c76b4f; --color-5: #a29061. 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