← Back to Editor

#876762 · #6E8474 · #CC5961 · #765C77 · #3592A3

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 Library

Color Details Color Details

#876762

Crimson · DimGray · Passion Red

HEX
#876762
RGB
rgb(135, 103, 98)
HSL
hsl(8, 16%, 46%)
HSB
hsb(8, 27%, 53%)
CMYK
cmyk(0%, 24%, 27%, 47%)
Oklch
oklch(54.4% 0.042 28.7)

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

#6E8474

Celadon · Gray · Warm Gray

HEX
#6E8474
RGB
rgb(110, 132, 116)
HSL
hsl(136, 9%, 47%)
HSB
hsb(136, 17%, 52%)
CMYK
cmyk(17%, 0%, 12%, 48%)
Oklch
oklch(59.1% 0.035 153.7)

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

#CC5961

Crimson · Tomato · Passion Red

HEX
#CC5961
RGB
rgb(204, 89, 97)
HSL
hsl(356, 53%, 57%)
HSB
hsb(356, 56%, 80%)
CMYK
cmyk(0%, 56%, 52%, 20%)
Oklch
oklch(61.1% 0.146 18.3)

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

#765C77

Dark Plum · DimGray · Violet

HEX
#765C77
RGB
rgb(118, 92, 119)
HSL
hsl(298, 13%, 41%)
HSB
hsb(298, 23%, 47%)
CMYK
cmyk(1%, 23%, 0%, 53%)
Oklch
oklch(51.1% 0.053 325.1)

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

#3592A3

Lake Blue · SteelBlue · Mint Ice

HEX
#3592A3
RGB
rgb(53, 146, 163)
HSL
hsl(189, 51%, 42%)
HSB
hsb(189, 67%, 64%)
CMYK
cmyk(67%, 10%, 0%, 36%)
Oklch
oklch(61.3% 0.089 212.0)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

876762
638388

Analogous

886370
876762
887A63

Triadic

876762
638868
686388

Split-Comp.

876762
63887A
637088

Tetradic

876762
708863
638388
7A6388

Contrast Matrix WCAG 2.1 Contrast

876762
6E8474
CC5961
765C77
3592A3
—
1.3
Fail
1.2
Fail
1.2
Fail
1.4
Fail
1.3
Fail
—
1.0
Fail
1.5
Fail
1.1
Fail
1.2
Fail
1.0
Fail
—
1.4
Fail
1.1
Fail
1.2
Fail
1.5
Fail
1.4
Fail
—
1.6
Fail
1.4
Fail
1.1
Fail
1.1
Fail
1.6
Fail
—
White BG
5.1AA
4.0AA Large
4.1AA Large
5.9AA
3.6AA Large
Black BG
4.1AA Large
5.2AA
5.2AA
3.6AA Large
5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

797963
787878
9A995F
6B6B70
5D5E9F

Deuteranopia

7B7D64
767579
A1A95F
6C6E6F
58519E

Tritanopia

856464
6F7B7C
C65E5D
756B6A
3A9C9B

Achromatopsia

707070
7C7C7C
7C7C7C
676767
787878

Shades & Tints Shades & Tints

#876762

Dark
Light

#6E8474

Dark
Light

#CC5961

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #876762;
  --color-2: #6e8474;
  --color-3: #cc5961;
  --color-4: #765c77;
  --color-5: #3592a3;
}

SCSS

$color-1: #876762;
$color-2: #6e8474;
$color-3: #cc5961;
$color-4: #765c77;
$color-5: #3592a3;

TAILWIND

colors: {
  'brand-1': '#876762',
  'brand-2': '#6e8474',
  'brand-3': '#cc5961',
  'brand-4': '#765c77',
  'brand-5': '#3592a3',
}

RGB Array

[135, 103, 98], [110, 132, 116], [204, 89, 97], [118, 92, 119], [53, 146, 163]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #876762, #6E8474, #CC5961, #765C77, #3592A3 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #876762; --color-2: #6e8474; --color-3: #cc5961; --color-4: #765c77; --color-5: #3592a3. 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. Restrained colors convey professionalism and trust. 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