← Back to Editor

#E89F76 · #A5746D · #615C60 · #334B4D · #112E32

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 LibraryData Visualization

Color Details Color Details

#E89F76

Apricot · DarkSalmon · Warm Sun

HEX
#E89F76
RGB
rgb(232, 159, 118)
HSL
hsl(22, 71%, 69%)
HSB
hsb(22, 49%, 91%)
CMYK
cmyk(0%, 31%, 49%, 9%)
Oklch
oklch(76.5% 0.103 50.0)

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

#A5746D

Crimson · Gray · Passion Red

HEX
#A5746D
RGB
rgb(165, 116, 109)
HSL
hsl(8, 24%, 54%)
HSB
hsb(8, 34%, 65%)
CMYK
cmyk(0%, 30%, 34%, 35%)
Oklch
oklch(60.7% 0.063 28.1)

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

#615C60

Ink Gray · DimGray · Charcoal

HEX
#615C60
RGB
rgb(97, 92, 96)
HSL
hsl(312, 3%, 37%)
HSB
hsb(312, 5%, 38%)
CMYK
cmyk(0%, 5%, 1%, 62%)
Oklch
oklch(48.1% 0.009 332.3)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#334B4D

Slate Blue · DarkSlateGray · Peacock Green

HEX
#334B4D
RGB
rgb(51, 75, 77)
HSL
hsl(185, 20%, 25%)
HSB
hsb(185, 34%, 30%)
CMYK
cmyk(34%, 3%, 0%, 70%)
Oklch
oklch(39.4% 0.030 202.5)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#112E32

Slate Blue · DarkSlateGray · Peacock Green

HEX
#112E32
RGB
rgb(17, 46, 50)
HSL
hsl(187, 49%, 13%)
HSB
hsb(187, 66%, 20%)
CMYK
cmyk(66%, 8%, 0%, 80%)
Oklch
oklch(28.1% 0.035 207.4)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E89F76
78BFE8

Analogous

E87887
E89F76
E8D978

Triadic

E89F76
78E8A1
A178E8

Split-Comp.

E89F76
78E8D9
7887E8

Tetradic

E89F76
87E878
78BFE8
D978E8

Contrast Matrix WCAG 2.1 Contrast

E89F76
A5746D
615C60
334B4D
112E32
—
1.8
Fail
3.0
AA Large
4.3
AA Large
6.6
AA
1.8
Fail
—
1.7
Fail
2.4
Fail
3.6
AA Large
3.0
AA Large
1.7
Fail
—
1.4
Fail
2.2
Fail
4.3
AA Large
2.4
Fail
1.4
Fail
—
1.5
Fail
6.6
AA
3.6
AA Large
2.2
Fail
1.5
Fail
—
White BG
2.2Fail
3.9AA Large
6.5AA
9.3AAA
14.4AAA
Black BG
9.7AAA
5.3AA
3.2AA Large
2.3Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C880
908F6F
5F5F5F
3D3E4D
1E1E31

Deuteranopia

CDD282
93966F
5F5F5F
3C3A4C
1C1A31

Tritanopia

E48889
A37070
615E5E
344C4C
123030

Achromatopsia

B0B0B0
828282
5E5E5E
444444
262626

Shades & Tints Shades & Tints

#E89F76

Dark
Light

#A5746D

Dark
Light

#615C60

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e89f76;
  --color-2: #a5746d;
  --color-3: #615c60;
  --color-4: #334b4d;
  --color-5: #112e32;
}

SCSS

$color-1: #e89f76;
$color-2: #a5746d;
$color-3: #615c60;
$color-4: #334b4d;
$color-5: #112e32;

TAILWIND

colors: {
  'brand-1': '#e89f76',
  'brand-2': '#a5746d',
  'brand-3': '#615c60',
  'brand-4': '#334b4d',
  'brand-5': '#112e32',
}

RGB Array

[232, 159, 118], [165, 116, 109], [97, 92, 96], [51, 75, 77], [17, 46, 50]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E89F76, #A5746D, #615C60, #334B4D, #112E32 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #e89f76; --color-2: #a5746d; --color-3: #615c60; --color-4: #334b4d; --color-5: #112e32. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. High-contrast palettes naturally meet WCAG accessibility standards. 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