#E8564F + #F87C60 + #5B7C73 + #779F7D + #9ECBE1 · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#E8564F

Peach Pink · Tomato · Coral Red

HEX

#E8564F

RGB

rgb(232, 86, 79)

HSL

hsl(3, 77%, 61%)

HSB

hsb(3, 66%, 91%)

CMYK

cmyk(0%, 63%, 66%, 9%)

Oklch

oklch(64.6% 0.182 26.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F87C60

Peach Pink · Coral · Coral Red

HEX

#F87C60

RGB

rgb(248, 124, 96)

HSL

hsl(11, 92%, 67%)

HSB

hsb(11, 61%, 97%)

CMYK

cmyk(0%, 50%, 61%, 3%)

Oklch

oklch(72.3% 0.158 34.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#5B7C73

Mineral Blue · DimGray · Mint Ice

HEX

#5B7C73

RGB

rgb(91, 124, 115)

HSL

hsl(164, 15%, 42%)

HSB

hsb(164, 27%, 49%)

CMYK

cmyk(27%, 0%, 7%, 51%)

Oklch

oklch(55.8% 0.040 176.1)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#779F7D

Celadon · Gray · Olive Green

HEX

#779F7D

RGB

rgb(119, 159, 125)

HSL

hsl(129, 17%, 55%)

HSB

hsb(129, 25%, 62%)

CMYK

cmyk(25%, 0%, 21%, 38%)

Oklch

oklch(66.3% 0.066 148.8)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#9ECBE1

Sky Blue · LightSteelBlue · Cobalt Blue

HEX

#9ECBE1

RGB

rgb(158, 203, 225)

HSL

hsl(200, 53%, 75%)

HSB

hsb(200, 30%, 88%)

CMYK

cmyk(30%, 10%, 0%, 12%)

Oklch

oklch(81.8% 0.057 229.3)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E8564F

4FE0E8

Analogous

E84F94

E8564F

E8A34F

Triadic

E8564F

4FE857

574FE8

Split-Comp.

E8564F

4FE8A3

4F94E8

Tetradic

E8564F

94E84F

4FE0E8

A34FE8

Contrast Matrix WCAG 2.1 Contrast

E8564F	F87C60	5B7C73	779F7D	9ECBE1
—	1.4 Fail	1.3 Fail	1.2 Fail	2.1 Fail
1.4 Fail	—	1.8 Fail	1.1 Fail	1.5 Fail
1.3 Fail	1.8 Fail	—	1.5 Fail	2.6 Fail
1.2 Fail	1.1 Fail	1.5 Fail	—	1.7 Fail
2.1 Fail	1.5 Fail	2.6 Fail	1.7 Fail	—

White BG

3.6AA Large

2.6Fail

4.6AA

3.0Fail

1.7Fail

Black BG

5.9AA

8.0AAA

4.6AA

7.0AAA

12.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9A751

C2C167

696A75

888985

B1B2DC

Deuteranopia

B1BC51

CAD368

676576

868387

AFACDA

Tritanopia

E15252

F26C6D

5D7777

798C8D

A0D7D7

Achromatopsia

818181

9E9E9E

717171

8F8F8F

C0C0C0

Shades & Tints Shades & Tints

#E8564F

Dark

Light

#F87C60

Dark

Light

#5B7C73

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e8564f;
  --color-2: #f87c60;
  --color-3: #5b7c73;
  --color-4: #779f7d;
  --color-5: #9ecbe1;
}

SCSS

$color-1: #e8564f;
$color-2: #f87c60;
$color-3: #5b7c73;
$color-4: #779f7d;
$color-5: #9ecbe1;

TAILWIND

colors: {
  'brand-1': '#e8564f',
  'brand-2': '#f87c60',
  'brand-3': '#5b7c73',
  'brand-4': '#779f7d',
  'brand-5': '#9ecbe1',
}

RGB Array

[232, 86, 79], [248, 124, 96], [91, 124, 115], [119, 159, 125], [158, 203, 225]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #E8564F, #F87C60, #5B7C73, #779F7D, #9ECBE1 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: #e8564f; --color-2: #f87c60; --color-3: #5b7c73; --color-4: #779f7d; --color-5: #9ecbe1. 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 pastel-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