← Back to Editor

#6B3264 · #8C5071 · #A26E73 · #A98971 · #C5A677

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

#6B3264

Rose Purple · DarkSlateBlue · Eggplant

HEX
#6B3264
RGB
rgb(107, 50, 100)
HSL
hsl(307, 36%, 31%)
HSB
hsb(307, 53%, 42%)
CMYK
cmyk(0%, 53%, 7%, 58%)
Oklch
oklch(41.2% 0.106 332.1)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#8C5071

Rose Purple · DimGray · Camellia

HEX
#8C5071
RGB
rgb(140, 80, 113)
HSL
hsl(327, 27%, 43%)
HSB
hsb(327, 43%, 55%)
CMYK
cmyk(0%, 43%, 19%, 45%)
Oklch
oklch(51.2% 0.091 346.7)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#A26E73

Crimson · Gray · Passion Red

HEX
#A26E73
RGB
rgb(162, 110, 115)
HSL
hsl(354, 22%, 53%)
HSB
hsb(354, 32%, 64%)
CMYK
cmyk(0%, 32%, 29%, 36%)
Oklch
oklch(59.4% 0.067 13.0)

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

#A98971

Tangerine · Gray · Warm Sun

HEX
#A98971
RGB
rgb(169, 137, 113)
HSL
hsl(26, 25%, 55%)
HSB
hsb(26, 33%, 66%)
CMYK
cmyk(0%, 19%, 33%, 34%)
Oklch
oklch(65.4% 0.052 58.6)

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

#C5A677

Ginger · Tan · Warm Sun

HEX
#C5A677
RGB
rgb(197, 166, 119)
HSL
hsl(36, 40%, 62%)
HSB
hsb(36, 40%, 77%)
CMYK
cmyk(0%, 16%, 40%, 23%)
Oklch
oklch(74.2% 0.073 77.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6B3264
336C39

Analogous

56336C
6B3264
6C3348

Triadic

6B3264
656C33
33656C

Split-Comp.

6B3264
486C33
336C56

Tetradic

6B3264
6C5633
336C39
33486C

Contrast Matrix WCAG 2.1 Contrast

6B3264
8C5071
A26E73
A98971
C5A677
—
1.5
Fail
2.2
Fail
2.9
Fail
4.0
AA Large
1.5
Fail
—
1.4
Fail
1.9
Fail
2.6
Fail
2.2
Fail
1.4
Fail
—
1.3
Fail
1.8
Fail
2.9
Fail
1.9
Fail
1.3
Fail
—
1.4
Fail
4.0
AA Large
2.6
Fail
1.8
Fail
1.4
Fail
—
White BG
9.3AAA
6.0AA
4.2AA Large
3.2AA Large
2.3Fail
Black BG
2.3Fail
3.5AA Large
5.0AA
6.5AA
9.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

525258
727169
8B8B72
9B9B77
B8B782

Deuteranopia

565A55
767A67
8F9272
9D9F78
B9BC85

Tritanopia

684E4C
896361
9F7171
A77B7C
C38B8D

Achromatopsia

494949
666666
7E7E7E
909090
AAAAAA

Shades & Tints Shades & Tints

#6B3264

Dark
Light

#8C5071

Dark
Light

#A26E73

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6b3264;
  --color-2: #8c5071;
  --color-3: #a26e73;
  --color-4: #a98971;
  --color-5: #c5a677;
}

SCSS

$color-1: #6b3264;
$color-2: #8c5071;
$color-3: #a26e73;
$color-4: #a98971;
$color-5: #c5a677;

TAILWIND

colors: {
  'brand-1': '#6b3264',
  'brand-2': '#8c5071',
  'brand-3': '#a26e73',
  'brand-4': '#a98971',
  'brand-5': '#c5a677',
}

RGB Array

[107, 50, 100], [140, 80, 113], [162, 110, 115], [169, 137, 113], [197, 166, 119]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6B3264, #8C5071, #A26E73, #A98971, #C5A677 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: #6b3264; --color-2: #8c5071; --color-3: #a26e73; --color-4: #a98971; --color-5: #c5a677. 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