#E84C3F + #DF5D36 + #EFB585 + #96AE96 + #8BA09C · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#E84C3F

Vermilion · Tomato · Passion Red

HEX

#E84C3F

RGB

rgb(232, 76, 63)

HSL

hsl(5, 79%, 58%)

HSB

hsb(5, 73%, 91%)

CMYK

cmyk(0%, 67%, 73%, 9%)

Oklch

oklch(63.3% 0.195 28.6)

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

#DF5D36

Vermilion · Chocolate · Passion Red

HEX

#DF5D36

RGB

rgb(223, 93, 54)

HSL

hsl(14, 73%, 54%)

HSB

hsb(14, 76%, 87%)

CMYK

cmyk(0%, 58%, 76%, 13%)

Oklch

oklch(63.8% 0.171 37.1)

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

#EFB585

Apricot · BurlyWood · Warm Sun

HEX

#EFB585

RGB

rgb(239, 181, 133)

HSL

hsl(27, 77%, 73%)

HSB

hsb(27, 44%, 94%)

CMYK

cmyk(0%, 24%, 44%, 6%)

Oklch

oklch(81.5% 0.092 60.6)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#96AE96

Celadon · DarkSeaGreen · Apple Green

HEX

#96AE96

RGB

rgb(150, 174, 150)

HSL

hsl(120, 13%, 64%)

HSB

hsb(120, 14%, 68%)

CMYK

cmyk(14%, 0%, 14%, 32%)

Oklch

oklch(72.6% 0.043 145.1)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#8BA09C

Mineral Blue · DarkSeaGreen · Lake Green

HEX

#8BA09C

RGB

rgb(139, 160, 156)

HSL

hsl(169, 10%, 59%)

HSB

hsb(169, 13%, 63%)

CMYK

cmyk(13%, 0%, 2%, 37%)

Oklch

oklch(68.8% 0.024 182.8)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E84C3F

3FDAE9

Analogous

E93F86

E84C3F

E9A23F

Triadic

E84C3F

3FE94D

4D3FE9

Split-Comp.

E84C3F

3FE9A2

3F86E9

Tetradic

E84C3F

86E93F

3FDAE9

A23FE9

Contrast Matrix WCAG 2.1 Contrast

E84C3F	DF5D36	EFB585	96AE96	8BA09C
—	1.0 Fail	2.1 Fail	1.6 Fail	1.4 Fail
1.0 Fail	—	2.0 Fail	1.5 Fail	1.3 Fail
2.1 Fail	2.0 Fail	—	1.3 Fail	1.5 Fail
1.6 Fail	1.5 Fail	1.3 Fail	—	1.2 Fail
1.4 Fail	1.3 Fail	1.5 Fail	1.2 Fail	—

White BG

3.8AA Large

3.6AA Large

1.8Fail

2.4Fail

2.8Fail

Black BG

5.5AA

5.8AA

11.6AAA

8.8AAA

7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A4A342

A7A63F

D6D591

A0A19C

94949D

Deuteranopia

AEB943

AEB842

D9DE93

9F9D9D

93919D

Tritanopia

E04545

D94749

EC9A9C

97A0A1

8C9E9E

Achromatopsia

797979

7F7F7F

C1C1C1

A4A4A4

999999

Shades & Tints Shades & Tints

#E84C3F

Dark

Light

#DF5D36

Dark

Light

#EFB585

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e84c3f;
  --color-2: #df5d36;
  --color-3: #efb585;
  --color-4: #96ae96;
  --color-5: #8ba09c;
}

SCSS

$color-1: #e84c3f;
$color-2: #df5d36;
$color-3: #efb585;
$color-4: #96ae96;
$color-5: #8ba09c;

TAILWIND

colors: {
  'brand-1': '#e84c3f',
  'brand-2': '#df5d36',
  'brand-3': '#efb585',
  'brand-4': '#96ae96',
  'brand-5': '#8ba09c',
}

RGB Array

[232, 76, 63], [223, 93, 54], [239, 181, 133], [150, 174, 150], [139, 160, 156]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #E84C3F, #DF5D36, #EFB585, #96AE96, #8BA09C 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: #e84c3f; --color-2: #df5d36; --color-3: #efb585; --color-4: #96ae96; --color-5: #8ba09c. 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 space-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