← Back to Editor

#765856 · #B9AF94 · #E7CC9F · #E27572 · #D82F56

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

#765856

Crimson · DimGray · Wine Red

HEX
#765856
RGB
rgb(118, 88, 86)
HSL
hsl(4, 16%, 40%)
HSB
hsb(4, 27%, 46%)
CMYK
cmyk(0%, 25%, 27%, 54%)
Oklch
oklch(49.1% 0.040 23.0)

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

#B9AF94

Ginger · Tan · Sunflower

HEX
#B9AF94
RGB
rgb(185, 175, 148)
HSL
hsl(44, 21%, 65%)
HSB
hsb(44, 20%, 73%)
CMYK
cmyk(0%, 5%, 20%, 27%)
Oklch
oklch(75.5% 0.039 90.1)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#E7CC9F

Goose Yellow · Wheat · Peach Orange

HEX
#E7CC9F
RGB
rgb(231, 204, 159)
HSL
hsl(38, 60%, 76%)
HSB
hsb(38, 31%, 91%)
CMYK
cmyk(0%, 12%, 31%, 9%)
Oklch
oklch(85.7% 0.066 80.3)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#E27572

Peach Pink · LightCoral · Coral Red

HEX
#E27572
RGB
rgb(226, 117, 114)
HSL
hsl(2, 66%, 67%)
HSB
hsb(2, 50%, 89%)
CMYK
cmyk(0%, 48%, 50%, 11%)
Oklch
oklch(68.6% 0.136 22.9)

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

#D82F56

Vermilion · Crimson · Passion Red

HEX
#D82F56
RGB
rgb(216, 47, 86)
HSL
hsl(346, 68%, 52%)
HSB
hsb(346, 78%, 85%)
CMYK
cmyk(0%, 78%, 60%, 15%)
Oklch
oklch(58.3% 0.203 13.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

765856
567476

Analogous

765664
765856
766856

Triadic

765856
567658
585676

Split-Comp.

765856
567668
566476

Tetradic

765856
647656
567476
685676

Contrast Matrix WCAG 2.1 Contrast

765856
B9AF94
E7CC9F
E27572
D82F56
—
2.9
Fail
4.1
AA Large
2.1
Fail
1.4
Fail
2.9
Fail
—
1.4
Fail
1.4
Fail
2.2
Fail
4.1
AA Large
1.4
Fail
—
1.9
Fail
3.0
AA Large
2.1
Fail
1.4
Fail
1.9
Fail
—
1.6
Fail
1.4
Fail
2.2
Fail
3.0
AA Large
1.6
Fail
—
White BG
6.4AA
2.2Fail
1.6Fail
3.0Fail
4.7AA
Black BG
3.3AA Large
9.6AAA
13.5AAA
7.0AAA
4.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

696956
B5B59B
DBDBAA
B3B273
8F8D4D

Deuteranopia

6B6D57
B5B69C
DDDFAD
B9C173
99A54A

Tritanopia

755757
B9A0A1
E6B2B4
DD7373
D04543

Achromatopsia

616161
AFAFAF
CFCFCF
959595
666666

Shades & Tints Shades & Tints

#765856

Dark
Light

#B9AF94

Dark
Light

#E7CC9F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #765856;
  --color-2: #b9af94;
  --color-3: #e7cc9f;
  --color-4: #e27572;
  --color-5: #d82f56;
}

SCSS

$color-1: #765856;
$color-2: #b9af94;
$color-3: #e7cc9f;
$color-4: #e27572;
$color-5: #d82f56;

TAILWIND

colors: {
  'brand-1': '#765856',
  'brand-2': '#b9af94',
  'brand-3': '#e7cc9f',
  'brand-4': '#e27572',
  'brand-5': '#d82f56',
}

RGB Array

[118, 88, 86], [185, 175, 148], [231, 204, 159], [226, 117, 114], [216, 47, 86]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #765856, #B9AF94, #E7CC9F, #E27572, #D82F56 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: #765856; --color-2: #b9af94; --color-3: #e7cc9f; --color-4: #e27572; --color-5: #d82f56. 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