← Back to Editor

#767262 · #E5AE8B · #DDA58B · #E1917D · #D77869

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

#767262

Ochre · DimGray · Warm Gray

HEX
#767262
RGB
rgb(118, 114, 98)
HSL
hsl(48, 9%, 42%)
HSB
hsb(48, 17%, 46%)
CMYK
cmyk(0%, 3%, 17%, 54%)
Oklch
oklch(55.1% 0.024 95.5)

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

#E5AE8B

Apricot · BurlyWood · Warm Sun

HEX
#E5AE8B
RGB
rgb(229, 174, 139)
HSL
hsl(23, 63%, 72%)
HSB
hsb(23, 39%, 90%)
CMYK
cmyk(0%, 24%, 39%, 10%)
Oklch
oklch(79.3% 0.080 53.7)

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

#DDA58B

Apricot · Tan · Warm Sun

HEX
#DDA58B
RGB
rgb(221, 165, 139)
HSL
hsl(19, 55%, 71%)
HSB
hsb(19, 37%, 87%)
CMYK
cmyk(0%, 25%, 37%, 13%)
Oklch
oklch(76.8% 0.076 46.0)

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

#E1917D

Peach Pink · DarkSalmon · Coral Red

HEX
#E1917D
RGB
rgb(225, 145, 125)
HSL
hsl(12, 63%, 69%)
HSB
hsb(12, 44%, 88%)
CMYK
cmyk(0%, 36%, 44%, 12%)
Oklch
oklch(73.3% 0.102 34.7)

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

#D77869

Peach Pink · LightCoral · Coral Red

HEX
#D77869
RGB
rgb(215, 120, 105)
HSL
hsl(8, 58%, 63%)
HSB
hsb(8, 51%, 84%)
CMYK
cmyk(0%, 44%, 51%, 16%)
Oklch
oklch(67.5% 0.122 30.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

767262
616575

Analogous

756761
767262
6F7561

Triadic

767262
617571
716175

Split-Comp.

767262
616F75
676175

Tetradic

767262
617567
616575
75616F

Contrast Matrix WCAG 2.1 Contrast

767262
E5AE8B
DDA58B
E1917D
D77869
—
2.5
Fail
2.3
Fail
2.0
Fail
1.6
Fail
2.5
Fail
—
1.1
Fail
1.3
Fail
1.6
Fail
2.3
Fail
1.1
Fail
—
1.1
Fail
1.4
Fail
2.0
Fail
1.3
Fail
1.1
Fail
—
1.3
Fail
1.6
Fail
1.6
Fail
1.4
Fail
1.3
Fail
—
White BG
4.8AA
2.0Fail
2.1Fail
2.5Fail
3.1AA Large
Black BG
4.4AA Large
10.8AAA
9.8AAA
8.5AAA
6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

747466
CDCD93
C5C491
BEBE82
AEAD6D

Deuteranopia

757567
D0D496
C8CC93
C3C983
B3BB6E

Tritanopia

76696A
E29A9C
DA9697
DD8687
D26F70

Achromatopsia

717171
BABABA
B3B3B3
A7A7A7
939393

Shades & Tints Shades & Tints

#767262

Dark
Light

#E5AE8B

Dark
Light

#DDA58B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #767262;
  --color-2: #e5ae8b;
  --color-3: #dda58b;
  --color-4: #e1917d;
  --color-5: #d77869;
}

SCSS

$color-1: #767262;
$color-2: #e5ae8b;
$color-3: #dda58b;
$color-4: #e1917d;
$color-5: #d77869;

TAILWIND

colors: {
  'brand-1': '#767262',
  'brand-2': '#e5ae8b',
  'brand-3': '#dda58b',
  'brand-4': '#e1917d',
  'brand-5': '#d77869',
}

RGB Array

[118, 114, 98], [229, 174, 139], [221, 165, 139], [225, 145, 125], [215, 120, 105]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #767262, #E5AE8B, #DDA58B, #E1917D, #D77869 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: #767262; --color-2: #e5ae8b; --color-3: #dda58b; --color-4: #e1917d; --color-5: #d77869. 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