← Back to Editor

#C7BA8D · #ADB26F · #B2875C · #B76B6B · #9888A5

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

#C7BA8D

Ginger · Tan · Sunflower

HEX
#C7BA8D
RGB
rgb(199, 186, 141)
HSL
hsl(47, 34%, 67%)
HSB
hsb(47, 29%, 78%)
CMYK
cmyk(0%, 7%, 29%, 22%)
Oklch
oklch(78.9% 0.062 93.9)

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

#ADB26F

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#ADB26F
RGB
rgb(173, 178, 111)
HSL
hsl(64, 30%, 57%)
HSB
hsb(64, 38%, 70%)
CMYK
cmyk(3%, 0%, 38%, 30%)
Oklch
oklch(74.4% 0.089 112.0)

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

#B2875C

Ginger · Gray · Warm Sun

HEX
#B2875C
RGB
rgb(178, 135, 92)
HSL
hsl(30, 36%, 53%)
HSB
hsb(30, 48%, 70%)
CMYK
cmyk(0%, 24%, 48%, 30%)
Oklch
oklch(65.5% 0.079 65.7)

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

#B76B6B

Crimson · Gray · Passion Red

HEX
#B76B6B
RGB
rgb(183, 107, 107)
HSL
hsl(0, 35%, 57%)
HSB
hsb(0, 42%, 72%)
CMYK
cmyk(0%, 42%, 42%, 28%)
Oklch
oklch(61.2% 0.097 20.3)

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

#9888A5

Dark Plum · LightSlateGray · Violet

HEX
#9888A5
RGB
rgb(152, 136, 165)
HSL
hsl(273, 14%, 59%)
HSB
hsb(273, 18%, 65%)
CMYK
cmyk(8%, 18%, 0%, 35%)
Oklch
oklch(65.1% 0.046 309.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C7BA8D
8E9BC7

Analogous

C79E8E
C7BA8D
B7C78E

Triadic

C7BA8D
8EC7BB
BB8EC7

Split-Comp.

C7BA8D
8EB7C7
9E8EC7

Tetradic

C7BA8D
8EC79E
8E9BC7
C78EB7

Contrast Matrix WCAG 2.1 Contrast

C7BA8D
ADB26F
B2875C
B76B6B
9888A5
—
1.2
Fail
1.7
Fail
2.0
Fail
1.7
Fail
1.2
Fail
—
1.4
Fail
1.8
Fail
1.5
Fail
1.7
Fail
1.4
Fail
—
1.2
Fail
1.0
Fail
2.0
Fail
1.8
Fail
1.2
Fail
—
1.2
Fail
1.7
Fail
1.5
Fail
1.0
Fail
1.2
Fail
—
White BG
1.9Fail
2.2Fail
3.2AA Large
3.9AA Large
3.3AA Large
Black BG
10.8AAA
9.4AAA
6.5AA
5.3AA
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C1C198
AFAF7F
9F9F66
96956B
91919E

Deuteranopia

C2C39B
AFAF83
A2A569
9BA06B
92939C

Tritanopia

C6A0A2
AD8C8F
B06F70
B36B6B
979897

Achromatopsia

B9B9B9
A9A9A9
8F8F8F
828282
909090

Shades & Tints Shades & Tints

#C7BA8D

Dark
Light

#ADB26F

Dark
Light

#B2875C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c7ba8d;
  --color-2: #adb26f;
  --color-3: #b2875c;
  --color-4: #b76b6b;
  --color-5: #9888a5;
}

SCSS

$color-1: #c7ba8d;
$color-2: #adb26f;
$color-3: #b2875c;
$color-4: #b76b6b;
$color-5: #9888a5;

TAILWIND

colors: {
  'brand-1': '#c7ba8d',
  'brand-2': '#adb26f',
  'brand-3': '#b2875c',
  'brand-4': '#b76b6b',
  'brand-5': '#9888a5',
}

RGB Array

[199, 186, 141], [173, 178, 111], [178, 135, 92], [183, 107, 107], [152, 136, 165]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C7BA8D, #ADB26F, #B2875C, #B76B6B, #9888A5 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: #c7ba8d; --color-2: #adb26f; --color-3: #b2875c; --color-4: #b76b6b; --color-5: #9888a5. 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