← Back to Editor

#E7AF90 · #DB937A · #BE8576 · #68535B · #938A8F

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

#E7AF90

Apricot · BurlyWood · Warm Sun

HEX
#E7AF90
RGB
rgb(231, 175, 144)
HSL
hsl(21, 64%, 74%)
HSB
hsb(21, 38%, 91%)
CMYK
cmyk(0%, 24%, 38%, 9%)
Oklch
oklch(79.8% 0.078 50.2)

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

#DB937A

Apricot · DarkSalmon · Warm Sun

HEX
#DB937A
RGB
rgb(219, 147, 122)
HSL
hsl(15, 57%, 67%)
HSB
hsb(15, 44%, 86%)
CMYK
cmyk(0%, 33%, 44%, 14%)
Oklch
oklch(72.9% 0.095 39.9)

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

#BE8576

Crimson · DarkSalmon · Passion Red

HEX
#BE8576
RGB
rgb(190, 133, 118)
HSL
hsl(13, 36%, 60%)
HSB
hsb(13, 38%, 75%)
CMYK
cmyk(0%, 30%, 38%, 25%)
Oklch
oklch(67.0% 0.074 35.3)

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

#68535B

Dark Violet · DimGray · Camellia

HEX
#68535B
RGB
rgb(104, 83, 91)
HSL
hsl(337, 11%, 37%)
HSB
hsb(337, 20%, 41%)
CMYK
cmyk(0%, 20%, 12%, 59%)
Oklch
oklch(46.6% 0.030 353.5)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#938A8F

Ash · Gray · Silver Sand

HEX
#938A8F
RGB
rgb(147, 138, 143)
HSL
hsl(327, 4%, 56%)
HSB
hsb(327, 6%, 58%)
CMYK
cmyk(0%, 6%, 3%, 42%)
Oklch
oklch(64.3% 0.013 342.8)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E7AF90
92C9E7

Analogous

E7929F
E7AF90
E7DA92

Triadic

E7AF90
92E7B0
B092E7

Split-Comp.

E7AF90
92E7DA
929FE7

Tetradic

E7AF90
9FE792
92C9E7
DA92E7

Contrast Matrix WCAG 2.1 Contrast

E7AF90
DB937A
BE8576
68535B
938A8F
—
1.3
Fail
1.6
Fail
3.7
AA Large
1.7
Fail
1.3
Fail
—
1.2
Fail
2.8
Fail
1.3
Fail
1.6
Fail
1.2
Fail
—
2.3
Fail
1.1
Fail
3.7
AA Large
2.8
Fail
2.3
Fail
—
2.1
Fail
1.7
Fail
1.3
Fail
1.1
Fail
2.1
Fail
—
White BG
1.9Fail
2.5Fail
3.1AA Large
7.1AAA
3.3AA Large
Black BG
10.9AAA
8.5AAA
6.8AA
3.0Fail
6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCE98
BCBB80
A5A57A
5F5F59
8F8F8E

Deuteranopia

D2D699
C0C582
A9AD7B
606259
90908E

Tritanopia

E49D9F
D78586
BB7C7D
675857
938D8D

Achromatopsia

BCBCBC
A6A6A6
949494
5A5A5A
8D8D8D

Shades & Tints Shades & Tints

#E7AF90

Dark
Light

#DB937A

Dark
Light

#BE8576

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e7af90;
  --color-2: #db937a;
  --color-3: #be8576;
  --color-4: #68535b;
  --color-5: #938a8f;
}

SCSS

$color-1: #e7af90;
$color-2: #db937a;
$color-3: #be8576;
$color-4: #68535b;
$color-5: #938a8f;

TAILWIND

colors: {
  'brand-1': '#e7af90',
  'brand-2': '#db937a',
  'brand-3': '#be8576',
  'brand-4': '#68535b',
  'brand-5': '#938a8f',
}

RGB Array

[231, 175, 144], [219, 147, 122], [190, 133, 118], [104, 83, 91], [147, 138, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E7AF90, #DB937A, #BE8576, #68535B, #938A8F 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: #e7af90; --color-2: #db937a; --color-3: #be8576; --color-4: #68535b; --color-5: #938a8f. 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