← Back to Editor

#E69D7A · #DC6D5A · #8C9B88 · #DAA03F · #BA7844

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

#E69D7A

Apricot · DarkSalmon · Warm Sun

HEX
#E69D7A
RGB
rgb(230, 157, 122)
HSL
hsl(19, 68%, 69%)
HSB
hsb(19, 47%, 90%)
CMYK
cmyk(0%, 32%, 47%, 10%)
Oklch
oklch(76.0% 0.100 46.4)

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

#DC6D5A

Peach Pink · Coral · Coral Red

HEX
#DC6D5A
RGB
rgb(220, 109, 90)
HSL
hsl(9, 65%, 61%)
HSB
hsb(9, 59%, 86%)
CMYK
cmyk(0%, 50%, 59%, 14%)
Oklch
oklch(66.1% 0.143 31.2)

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

#8C9B88

Celadon · Gray · Silver Sand

HEX
#8C9B88
RGB
rgb(140, 155, 136)
HSL
hsl(107, 9%, 57%)
HSB
hsb(107, 12%, 61%)
CMYK
cmyk(10%, 0%, 12%, 39%)
Oklch
oklch(67.2% 0.032 139.1)

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

#DAA03F

Ginger · GoldenRod · Warm Sun

HEX
#DAA03F
RGB
rgb(218, 160, 63)
HSL
hsl(38, 68%, 55%)
HSB
hsb(38, 71%, 85%)
CMYK
cmyk(0%, 27%, 71%, 15%)
Oklch
oklch(74.4% 0.130 76.8)

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

#BA7844

Tangerine · Chocolate · Amber Brown

HEX
#BA7844
RGB
rgb(186, 120, 68)
HSL
hsl(26, 46%, 50%)
HSB
hsb(26, 63%, 73%)
CMYK
cmyk(0%, 35%, 63%, 27%)
Oklch
oklch(63.2% 0.107 57.4)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E69D7A
7AC4E6

Analogous

E67A8E
E69D7A
E6D27A

Triadic

E69D7A
7AE69C
9C7AE6

Split-Comp.

E69D7A
7AE6D2
7A8EE6

Tetradic

E69D7A
8EE67A
7AC4E6
D27AE6

Contrast Matrix WCAG 2.1 Contrast

E69D7A
DC6D5A
8C9B88
DAA03F
BA7844
—
1.5
Fail
1.3
Fail
1.0
Fail
1.6
Fail
1.5
Fail
—
1.1
Fail
1.4
Fail
1.1
Fail
1.3
Fail
1.1
Fail
—
1.3
Fail
1.2
Fail
1.0
Fail
1.4
Fail
1.3
Fail
—
1.6
Fail
1.6
Fail
1.1
Fail
1.2
Fail
1.6
Fail
—
White BG
2.2Fail
3.3AA Large
2.9Fail
2.3Fail
3.6AA Large
Black BG
9.5AAA
6.4AA
7.2AAA
9.1AAA
5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C6C682
ACAB5F
92938D
C1C056
9D9D51

Deuteranopia

CBD085
B2BB60
92918E
C4C95C
A1A654

Tritanopia

E2898B
D66263
8D9091
D7696D
B75B5D

Achromatopsia

AFAFAF
8C8C8C
949494
A6A6A6
868686

Shades & Tints Shades & Tints

#E69D7A

Dark
Light

#DC6D5A

Dark
Light

#8C9B88

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e69d7a;
  --color-2: #dc6d5a;
  --color-3: #8c9b88;
  --color-4: #daa03f;
  --color-5: #ba7844;
}

SCSS

$color-1: #e69d7a;
$color-2: #dc6d5a;
$color-3: #8c9b88;
$color-4: #daa03f;
$color-5: #ba7844;

TAILWIND

colors: {
  'brand-1': '#e69d7a',
  'brand-2': '#dc6d5a',
  'brand-3': '#8c9b88',
  'brand-4': '#daa03f',
  'brand-5': '#ba7844',
}

RGB Array

[230, 157, 122], [220, 109, 90], [140, 155, 136], [218, 160, 63], [186, 120, 68]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E69D7A, #DC6D5A, #8C9B88, #DAA03F, #BA7844 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: #e69d7a; --color-2: #dc6d5a; --color-3: #8c9b88; --color-4: #daa03f; --color-5: #ba7844. 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