← Back to Editor

#9E5A47 · #B87D5B · #D09F64 · #E64D5A · #EC7564

pastel

A 5-color pastel palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#9E5A47

Crimson · Sienna · Passion Red

HEX
#9E5A47
RGB
rgb(158, 90, 71)
HSL
hsl(13, 38%, 45%)
HSB
hsb(13, 55%, 62%)
CMYK
cmyk(0%, 43%, 55%, 38%)
Oklch
oklch(54.2% 0.095 36.5)

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

#B87D5B

Tangerine · DarkSalmon · Warm Sun

HEX
#B87D5B
RGB
rgb(184, 125, 91)
HSL
hsl(22, 40%, 54%)
HSB
hsb(22, 51%, 72%)
CMYK
cmyk(0%, 32%, 51%, 28%)
Oklch
oklch(64.2% 0.088 50.6)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#D09F64

Ginger · DarkSalmon · Warm Sun

HEX
#D09F64
RGB
rgb(208, 159, 100)
HSL
hsl(33, 53%, 60%)
HSB
hsb(33, 52%, 82%)
CMYK
cmyk(0%, 24%, 52%, 18%)
Oklch
oklch(73.6% 0.096 70.6)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#E64D5A

Vermilion · Tomato · Passion Red

HEX
#E64D5A
RGB
rgb(230, 77, 90)
HSL
hsl(355, 75%, 60%)
HSB
hsb(355, 67%, 90%)
CMYK
cmyk(0%, 67%, 61%, 10%)
Oklch
oklch(63.5% 0.188 19.6)

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

#EC7564

Peach Pink · Salmon · Coral Red

HEX
#EC7564
RGB
rgb(236, 117, 100)
HSL
hsl(7, 78%, 66%)
HSB
hsb(7, 58%, 93%)
CMYK
cmyk(0%, 50%, 58%, 7%)
Oklch
oklch(69.7% 0.150 29.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9E5A47
478B9E

Analogous

9E4760
9E5A47
9E8647

Triadic

9E5A47
479E5A
5A479E

Split-Comp.

9E5A47
479E86
47609E

Tetradic

9E5A47
609E47
478B9E
86479E

Contrast Matrix WCAG 2.1 Contrast

9E5A47
B87D5B
D09F64
E64D5A
EC7564
—
1.5
Fail
2.2
Fail
1.4
Fail
1.8
Fail
1.5
Fail
—
1.4
Fail
1.1
Fail
1.2
Fail
2.2
Fail
1.4
Fail
—
1.6
Fail
1.2
Fail
1.4
Fail
1.1
Fail
1.6
Fail
—
1.3
Fail
1.8
Fail
1.2
Fail
1.2
Fail
1.3
Fail
—
White BG
5.2AA
3.4AA Large
2.4Fail
3.8AA Large
2.9Fail
Black BG
4.0AA Large
6.1AA
8.8AAA
5.6AA
7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

81804C
9E9E63
BBBA72
A4A257
B8B768

Deuteranopia

858A4D
A2A665
BEC176
ADB856
BFC869

Tritanopia

9B4F50
B56A6B
CE7E80
DE5454
E66B6C

Achromatopsia

6C6C6C
8B8B8B
A7A7A7
7C7C7C
979797

Shades & Tints Shades & Tints

#9E5A47

Dark
Light

#B87D5B

Dark
Light

#D09F64

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9e5a47;
  --color-2: #b87d5b;
  --color-3: #d09f64;
  --color-4: #e64d5a;
  --color-5: #ec7564;
}

SCSS

$color-1: #9e5a47;
$color-2: #b87d5b;
$color-3: #d09f64;
$color-4: #e64d5a;
$color-5: #ec7564;

TAILWIND

colors: {
  'brand-1': '#9e5a47',
  'brand-2': '#b87d5b',
  'brand-3': '#d09f64',
  'brand-4': '#e64d5a',
  'brand-5': '#ec7564',
}

RGB Array

[158, 90, 71], [184, 125, 91], [208, 159, 100], [230, 77, 90], [236, 117, 100]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #9E5A47, #B87D5B, #D09F64, #E64D5A, #EC7564 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: #9e5a47; --color-2: #b87d5b; --color-3: #d09f64; --color-4: #e64d5a; --color-5: #ec7564. 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