← Back to Editor

#7C5D63 · #A08387 · #B3A6B7 · #C4CAB0 · #BDBD73

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

#7C5D63

Crimson · DimGray · Passion Red

HEX
#7C5D63
RGB
rgb(124, 93, 99)
HSL
hsl(348, 14%, 43%)
HSB
hsb(348, 25%, 49%)
CMYK
cmyk(0%, 25%, 20%, 51%)
Oklch
oklch(51.2% 0.041 5.7)

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

#A08387

Crimson · Gray · Passion Red

HEX
#A08387
RGB
rgb(160, 131, 135)
HSL
hsl(352, 13%, 57%)
HSB
hsb(352, 18%, 63%)
CMYK
cmyk(0%, 18%, 16%, 37%)
Oklch
oklch(63.8% 0.036 8.8)

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

#B3A6B7

Lilac · DarkGray · Lilac Purple

HEX
#B3A6B7
RGB
rgb(179, 166, 183)
HSL
hsl(286, 11%, 68%)
HSB
hsb(286, 9%, 72%)
CMYK
cmyk(2%, 9%, 0%, 28%)
Oklch
oklch(74.1% 0.028 318.2)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#C4CAB0

Willow Green · Silver · Apple Green

HEX
#C4CAB0
RGB
rgb(196, 202, 176)
HSL
hsl(74, 20%, 74%)
HSB
hsb(74, 13%, 79%)
CMYK
cmyk(3%, 0%, 13%, 21%)
Oklch
oklch(82.7% 0.036 117.7)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#BDBD73

Autumn Sage · Tan · Sunflower

HEX
#BDBD73
RGB
rgb(189, 189, 115)
HSL
hsl(60, 36%, 60%)
HSB
hsb(60, 39%, 74%)
CMYK
cmyk(0%, 0%, 39%, 26%)
Oklch
oklch(78.2% 0.096 108.4)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7C5D63
5E7D77

Analogous

7D5E74
7C5D63
7D685E

Triadic

7C5D63
647D5E
5E647D

Split-Comp.

7C5D63
5E7D68
5E747D

Tetradic

7C5D63
747D5E
5E7D77
685E7D

Contrast Matrix WCAG 2.1 Contrast

7C5D63
A08387
B3A6B7
C4CAB0
BDBD73
—
1.7
Fail
2.5
Fail
3.4
AA Large
3.0
Fail
1.7
Fail
—
1.5
Fail
2.0
Fail
1.8
Fail
2.5
Fail
1.5
Fail
—
1.4
Fail
1.2
Fail
3.4
AA Large
2.0
Fail
1.4
Fail
—
1.2
Fail
3.0
Fail
1.8
Fail
1.2
Fail
1.2
Fail
—
White BG
5.8AA
3.4AA Large
2.3Fail
1.7Fail
2.0Fail
Black BG
3.6AA Large
6.1AA
9.1AAA
12.4AAA
10.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6F6E62
939386
ADADB3
C7C7B6
BDBD85

Deuteranopia

707361
959786
AEAFB2
C6C6B8
BDBD89

Tritanopia

7A6060
9F8585
B2B0AF
C4BBBC
BD9396

Achromatopsia

676767
8C8C8C
ACACAC
C5C5C5
B5B5B5

Shades & Tints Shades & Tints

#7C5D63

Dark
Light

#A08387

Dark
Light

#B3A6B7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7c5d63;
  --color-2: #a08387;
  --color-3: #b3a6b7;
  --color-4: #c4cab0;
  --color-5: #bdbd73;
}

SCSS

$color-1: #7c5d63;
$color-2: #a08387;
$color-3: #b3a6b7;
$color-4: #c4cab0;
$color-5: #bdbd73;

TAILWIND

colors: {
  'brand-1': '#7c5d63',
  'brand-2': '#a08387',
  'brand-3': '#b3a6b7',
  'brand-4': '#c4cab0',
  'brand-5': '#bdbd73',
}

RGB Array

[124, 93, 99], [160, 131, 135], [179, 166, 183], [196, 202, 176], [189, 189, 115]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7C5D63, #A08387, #B3A6B7, #C4CAB0, #BDBD73 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: #7c5d63; --color-2: #a08387; --color-3: #b3a6b7; --color-4: #c4cab0; --color-5: #bdbd73. 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