← Back to Editor

#EE7157 · #D98866 · #C29A76 · #ABA685 · #7E9E8E

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

#EE7157

Peach Pink · Coral · Coral Red

HEX
#EE7157
RGB
rgb(238, 113, 87)
HSL
hsl(10, 82%, 64%)
HSB
hsb(10, 63%, 93%)
CMYK
cmyk(0%, 53%, 63%, 7%)
Oklch
oklch(69.2% 0.160 33.2)

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

#D98866

Apricot · DarkSalmon · Warm Sun

HEX
#D98866
RGB
rgb(217, 136, 102)
HSL
hsl(18, 60%, 63%)
HSB
hsb(18, 53%, 85%)
CMYK
cmyk(0%, 37%, 53%, 15%)
Oklch
oklch(70.4% 0.110 43.4)

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

#C29A76

Apricot · Tan · Warm Sun

HEX
#C29A76
RGB
rgb(194, 154, 118)
HSL
hsl(28, 38%, 61%)
HSB
hsb(28, 39%, 76%)
CMYK
cmyk(0%, 21%, 39%, 24%)
Oklch
oklch(71.4% 0.069 63.4)

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

#ABA685

Autumn Sage · DarkGray · Sunflower

HEX
#ABA685
RGB
rgb(171, 166, 133)
HSL
hsl(52, 18%, 60%)
HSB
hsb(52, 22%, 67%)
CMYK
cmyk(0%, 3%, 22%, 33%)
Oklch
oklch(72.1% 0.046 100.3)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#7E9E8E

Mineral Blue · LightSlateGray · Olive Green

HEX
#7E9E8E
RGB
rgb(126, 158, 142)
HSL
hsl(150, 14%, 56%)
HSB
hsb(150, 20%, 62%)
CMYK
cmyk(20%, 0%, 10%, 38%)
Oklch
oklch(67.0% 0.043 163.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EE7157
58D5EE

Analogous

EE588A
EE7157
EEBC58

Triadic

EE7157
58EE71
7158EE

Split-Comp.

EE7157
58EEBC
588AEE

Tetradic

EE7157
8AEE58
58D5EE
BC58EE

Contrast Matrix WCAG 2.1 Contrast

EE7157
D98866
C29A76
ABA685
7E9E8E
—
1.1
Fail
1.1
Fail
1.2
Fail
1.0
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
—
1.0
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.0
Fail
—
1.2
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.2
Fail
—
White BG
2.9Fail
2.7Fail
2.6Fail
2.5Fail
2.9Fail
Black BG
7.1AAA
7.7AAA
8.2AAA
8.5AAA
7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B8B75D
B6B56E
B1B07F
A9A98D
8C8C92

Deuteranopia

BFC95F
BBC170
B3B681
A9AA8F
8A8893

Tritanopia

E86263
D57576
C08687
AB9395
809596

Achromatopsia

939393
9C9C9C
A2A2A2
A4A4A4
939393

Shades & Tints Shades & Tints

#EE7157

Dark
Light

#D98866

Dark
Light

#C29A76

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ee7157;
  --color-2: #d98866;
  --color-3: #c29a76;
  --color-4: #aba685;
  --color-5: #7e9e8e;
}

SCSS

$color-1: #ee7157;
$color-2: #d98866;
$color-3: #c29a76;
$color-4: #aba685;
$color-5: #7e9e8e;

TAILWIND

colors: {
  'brand-1': '#ee7157',
  'brand-2': '#d98866',
  'brand-3': '#c29a76',
  'brand-4': '#aba685',
  'brand-5': '#7e9e8e',
}

RGB Array

[238, 113, 87], [217, 136, 102], [194, 154, 118], [171, 166, 133], [126, 158, 142]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EE7157, #D98866, #C29A76, #ABA685, #7E9E8E 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: #ee7157; --color-2: #d98866; --color-3: #c29a76; --color-4: #aba685; --color-5: #7e9e8e. 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