← Back to Editor

#827B76 · #B79EB3 · #87BBAE · #AAD17B · #71756A

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

#827B76

Ink Gray · Gray · Warm Gray

HEX
#827B76
RGB
rgb(130, 123, 118)
HSL
hsl(25, 5%, 49%)
HSB
hsb(25, 9%, 51%)
CMYK
cmyk(0%, 5%, 9%, 49%)
Oklch
oklch(58.8% 0.011 58.1)

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

#B79EB3

Mauve · DarkGray · Lilac Purple

HEX
#B79EB3
RGB
rgb(183, 158, 179)
HSL
hsl(310, 15%, 67%)
HSB
hsb(310, 14%, 72%)
CMYK
cmyk(0%, 14%, 2%, 28%)
Oklch
oklch(72.8% 0.041 331.3)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#87BBAE

Jade · DarkSeaGreen · Lake Green

HEX
#87BBAE
RGB
rgb(135, 187, 174)
HSL
hsl(165, 28%, 63%)
HSB
hsb(165, 28%, 73%)
CMYK
cmyk(28%, 0%, 7%, 27%)
Oklch
oklch(75.2% 0.058 177.4)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#AAD17B

Willow Green · DarkSeaGreen · Apple Green

HEX
#AAD17B
RGB
rgb(170, 209, 123)
HSL
hsl(87, 48%, 65%)
HSB
hsb(87, 41%, 82%)
CMYK
cmyk(19%, 0%, 41%, 18%)
Oklch
oklch(81.3% 0.121 128.7)

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

#71756A

Ink Gray · DimGray · Warm Gray

HEX
#71756A
RGB
rgb(113, 117, 106)
HSL
hsl(82, 5%, 44%)
HSB
hsb(82, 9%, 46%)
CMYK
cmyk(3%, 0%, 9%, 54%)
Oklch
oklch(55.6% 0.017 123.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

827B76
777E83

Analogous

837778
827B76
838277

Triadic

827B76
77837C
7C7783

Split-Comp.

827B76
778382
777883

Tetradic

827B76
788377
777E83
827783

Contrast Matrix WCAG 2.1 Contrast

827B76
B79EB3
87BBAE
AAD17B
71756A
—
1.7
Fail
1.9
Fail
2.4
Fail
1.1
Fail
1.7
Fail
—
1.1
Fail
1.4
Fail
1.9
Fail
1.9
Fail
1.1
Fail
—
1.2
Fail
2.2
Fail
2.4
Fail
1.4
Fail
1.2
Fail
—
2.7
Fail
1.1
Fail
1.9
Fail
2.2
Fail
2.7
Fail
—
White BG
4.2AA Large
2.5Fail
2.2Fail
1.7Fail
4.7AA
Black BG
5.0AA
8.6AAA
9.7AAA
12.1AAA
4.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

7F7F77
ACACAE
9E9EB1
BBBB90
73736D

Deuteranopia

7F8078
AEB0AD
9B97B2
B9B695
73726D

Tritanopia

827878
B6AAA9
8AB4B4
ACA0A4
716F6F

Achromatopsia

7D7D7D
A8A8A8
AAAAAA
BCBCBC
737373

Shades & Tints Shades & Tints

#827B76

Dark
Light

#B79EB3

Dark
Light

#87BBAE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #827b76;
  --color-2: #b79eb3;
  --color-3: #87bbae;
  --color-4: #aad17b;
  --color-5: #71756a;
}

SCSS

$color-1: #827b76;
$color-2: #b79eb3;
$color-3: #87bbae;
$color-4: #aad17b;
$color-5: #71756a;

TAILWIND

colors: {
  'brand-1': '#827b76',
  'brand-2': '#b79eb3',
  'brand-3': '#87bbae',
  'brand-4': '#aad17b',
  'brand-5': '#71756a',
}

RGB Array

[130, 123, 118], [183, 158, 179], [135, 187, 174], [170, 209, 123], [113, 117, 106]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #827B76, #B79EB3, #87BBAE, #AAD17B, #71756A 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: #827b76; --color-2: #b79eb3; --color-3: #87bbae; --color-4: #aad17b; --color-5: #71756a. 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