← Back to Editor

#E93C1F · #CB7661 · #ADAFA3 · #BFBBAC · #D1C6B6

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

#E93C1F

Vermilion · OrangeRed · Passion Red

HEX
#E93C1F
RGB
rgb(233, 60, 31)
HSL
hsl(9, 82%, 52%)
HSB
hsb(9, 87%, 91%)
CMYK
cmyk(0%, 74%, 87%, 9%)
Oklch
oklch(61.6% 0.213 32.0)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#CB7661

Crimson · LightCoral · Passion Red

HEX
#CB7661
RGB
rgb(203, 118, 97)
HSL
hsl(12, 50%, 59%)
HSB
hsb(12, 52%, 80%)
CMYK
cmyk(0%, 42%, 52%, 20%)
Oklch
oklch(65.4% 0.112 34.8)

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

#ADAFA3

Ash · DarkGray · Silver Sand

HEX
#ADAFA3
RGB
rgb(173, 175, 163)
HSL
hsl(70, 7%, 66%)
HSB
hsb(70, 7%, 69%)
CMYK
cmyk(1%, 0%, 7%, 31%)
Oklch
oklch(74.9% 0.017 114.5)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#BFBBAC

Goose Yellow · Silver · Sunflower

HEX
#BFBBAC
RGB
rgb(191, 187, 172)
HSL
hsl(47, 13%, 71%)
HSB
hsb(47, 10%, 75%)
CMYK
cmyk(0%, 2%, 10%, 25%)
Oklch
oklch(79.1% 0.021 94.6)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#D1C6B6

Goose Yellow · Silver · Peach Orange

HEX
#D1C6B6
RGB
rgb(209, 198, 182)
HSL
hsl(36, 23%, 77%)
HSB
hsb(36, 13%, 82%)
CMYK
cmyk(0%, 5%, 13%, 18%)
Oklch
oklch(83.1% 0.025 77.4)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E93C1F
20CBE9

Analogous

E92066
E93C1F
E9A320

Triadic

E93C1F
20E93E
3E20E9

Split-Comp.

E93C1F
20E9A3
2066E9

Tetradic

E93C1F
66E920
20CBE9
A320E9

Contrast Matrix WCAG 2.1 Contrast

E93C1F
CB7661
ADAFA3
BFBBAC
D1C6B6
—
1.2
Fail
1.8
Fail
2.1
Fail
2.4
Fail
1.2
Fail
—
1.5
Fail
1.7
Fail
2.0
Fail
1.8
Fail
1.5
Fail
—
1.2
Fail
1.3
Fail
2.1
Fail
1.7
Fail
1.2
Fail
—
1.1
Fail
2.4
Fail
2.0
Fail
1.3
Fail
1.1
Fail
—
White BG
4.1AA Large
3.3AA Large
2.2Fail
1.9Fail
1.7Fail
Black BG
5.1AA
6.3AA
9.4AAA
10.9AAA
12.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9E9D26
A6A566
AEAEA6
BDBDB0
CCCCBA

Deuteranopia

A8B528
ABB267
AEAEA7
BEBEB1
CDCEBB

Tritanopia

E02C2D
C76A6B
ADA8A9
BFB2B3
D0BDBE

Achromatopsia

6C6C6C
8D8D8D
ADADAD
BABABA
C7C7C7

Shades & Tints Shades & Tints

#E93C1F

Dark
Light

#CB7661

Dark
Light

#ADAFA3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e93c1f;
  --color-2: #cb7661;
  --color-3: #adafa3;
  --color-4: #bfbbac;
  --color-5: #d1c6b6;
}

SCSS

$color-1: #e93c1f;
$color-2: #cb7661;
$color-3: #adafa3;
$color-4: #bfbbac;
$color-5: #d1c6b6;

TAILWIND

colors: {
  'brand-1': '#e93c1f',
  'brand-2': '#cb7661',
  'brand-3': '#adafa3',
  'brand-4': '#bfbbac',
  'brand-5': '#d1c6b6',
}

RGB Array

[233, 60, 31], [203, 118, 97], [173, 175, 163], [191, 187, 172], [209, 198, 182]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E93C1F, #CB7661, #ADAFA3, #BFBBAC, #D1C6B6 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: #e93c1f; --color-2: #cb7661; --color-3: #adafa3; --color-4: #bfbbac; --color-5: #d1c6b6. 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