← Back to Editor

#EBB697 · #ED9879 · #AA998F · #7D7C78 · #565C6A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#EBB697

Apricot · BurlyWood · Peach Orange

HEX
#EBB697
RGB
rgb(235, 182, 151)
HSL
hsl(22, 68%, 76%)
HSB
hsb(22, 36%, 92%)
CMYK
cmyk(0%, 23%, 36%, 8%)
Oklch
oklch(81.7% 0.075 51.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#ED9879

Apricot · DarkSalmon · Warm Sun

HEX
#ED9879
RGB
rgb(237, 152, 121)
HSL
hsl(16, 76%, 70%)
HSB
hsb(16, 49%, 93%)
CMYK
cmyk(0%, 36%, 49%, 7%)
Oklch
oklch(75.9% 0.112 40.8)

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

#AA998F

Apricot · DarkGray · Warm Sun

HEX
#AA998F
RGB
rgb(170, 153, 143)
HSL
hsl(22, 14%, 61%)
HSB
hsb(22, 16%, 67%)
CMYK
cmyk(0%, 10%, 16%, 33%)
Oklch
oklch(69.5% 0.025 52.5)

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

#7D7C78

Ink Gray · Gray · Warm Gray

HEX
#7D7C78
RGB
rgb(125, 124, 120)
HSL
hsl(48, 2%, 48%)
HSB
hsb(48, 4%, 49%)
CMYK
cmyk(0%, 1%, 4%, 51%)
Oklch
oklch(58.6% 0.006 95.2)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#565C6A

Indigo · DimGray · Prussian Blue

HEX
#565C6A
RGB
rgb(86, 92, 106)
HSL
hsl(222, 10%, 38%)
HSB
hsb(222, 19%, 42%)
CMYK
cmyk(19%, 13%, 0%, 58%)
Oklch
oklch(47.5% 0.024 267.1)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EBB697
98CDEB

Analogous

EB98A3
EBB697
EBE098

Triadic

EBB697
98EBB7
B798EB

Split-Comp.

EBB697
98EBE0
98A3EB

Tetradic

EBB697
A3EB98
98CDEB
E098EB

Contrast Matrix WCAG 2.1 Contrast

EBB697
ED9879
AA998F
7D7C78
565C6A
—
1.2
Fail
1.5
Fail
2.3
Fail
3.7
AA Large
1.2
Fail
—
1.2
Fail
1.9
Fail
3.0
Fail
1.5
Fail
1.2
Fail
—
1.5
Fail
2.4
Fail
2.3
Fail
1.9
Fail
1.5
Fail
—
1.6
Fail
3.7
AA Large
3.0
Fail
2.4
Fail
1.6
Fail
—
White BG
1.8Fail
2.2Fail
2.7Fail
4.2AA Large
6.7AA
Black BG
11.7AAA
9.4AAA
7.7AAA
5.0AA
3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D4D49F
C8C781
A3A291
7D7D79
595967

Deuteranopia

D7DBA0
CDD382
A4A592
7D7D79
585866

Tritanopia

E8A4A6
E98688
A99394
7D7A7A
566463

Achromatopsia

C2C2C2
AEAEAE
9D9D9D
7C7C7C
5C5C5C

Shades & Tints Shades & Tints

#EBB697

Dark
Light

#ED9879

Dark
Light

#AA998F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ebb697;
  --color-2: #ed9879;
  --color-3: #aa998f;
  --color-4: #7d7c78;
  --color-5: #565c6a;
}

SCSS

$color-1: #ebb697;
$color-2: #ed9879;
$color-3: #aa998f;
$color-4: #7d7c78;
$color-5: #565c6a;

TAILWIND

colors: {
  'brand-1': '#ebb697',
  'brand-2': '#ed9879',
  'brand-3': '#aa998f',
  'brand-4': '#7d7c78',
  'brand-5': '#565c6a',
}

RGB Array

[235, 182, 151], [237, 152, 121], [170, 153, 143], [125, 124, 120], [86, 92, 106]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EBB697, #ED9879, #AA998F, #7D7C78, #565C6A 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: #ebb697; --color-2: #ed9879; --color-3: #aa998f; --color-4: #7d7c78; --color-5: #565c6a. 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