← Back to Editor

#BB99AA · #35282E · #696169 · #8F878F · #CAC7C7

luxury

A 5-color luxury palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#BB99AA

Rouge · DarkGray · Rose Pink

HEX
#BB99AA
RGB
rgb(187, 153, 170)
HSL
hsl(330, 20%, 67%)
HSB
hsb(330, 18%, 73%)
CMYK
cmyk(0%, 18%, 9%, 27%)
Oklch
oklch(71.9% 0.046 346.8)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#35282E

Dark Violet · DarkSlateGray · Raspberry

HEX
#35282E
RGB
rgb(53, 40, 46)
HSL
hsl(332, 14%, 18%)
HSB
hsb(332, 25%, 21%)
CMYK
cmyk(0%, 25%, 13%, 79%)
Oklch
oklch(29.4% 0.022 349.1)

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

#696169

Ink Gray · DimGray · Charcoal

HEX
#696169
RGB
rgb(105, 97, 105)
HSL
hsl(300, 4%, 40%)
HSB
hsb(300, 8%, 41%)
CMYK
cmyk(0%, 8%, 0%, 59%)
Oklch
oklch(50.3% 0.016 325.8)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#8F878F

Ash · Gray · Warm Gray

HEX
#8F878F
RGB
rgb(143, 135, 143)
HSL
hsl(300, 3%, 55%)
HSB
hsb(300, 6%, 56%)
CMYK
cmyk(0%, 6%, 0%, 44%)
Oklch
oklch(63.3% 0.015 325.8)

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

#CAC7C7

Silver Gray · Silver · Pearl Gray

HEX
#CAC7C7
RGB
rgb(202, 199, 199)
HSL
hsl(0, 3%, 79%)
HSB
hsb(0, 1%, 79%)
CMYK
cmyk(0%, 1%, 1%, 21%)
Oklch
oklch(83.2% 0.003 17.2)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BB99AA
9ABCAB

Analogous

BC9ABC
BB99AA
BC9A9A

Triadic

BB99AA
ABBC9A
9AABBC

Split-Comp.

BB99AA
9ABC9A
9ABCBC

Tetradic

BB99AA
BCBC9A
9ABCAB
9A9ABC

Contrast Matrix WCAG 2.1 Contrast

BB99AA
35282E
696169
8F878F
CAC7C7
—
5.5
AA
2.3
Fail
1.4
Fail
1.5
Fail
5.5
AA
—
2.4
Fail
4.0
AA Large
8.4
AAA
2.3
Fail
2.4
Fail
—
1.7
Fail
3.6
AA Large
1.4
Fail
4.0
AA Large
1.7
Fail
—
2.1
Fail
1.5
Fail
8.4
AAA
3.6
AA Large
2.1
Fail
—
White BG
2.5Fail
14.1AAA
6.0AA
3.5AA Large
1.7Fail
Black BG
8.2AAA
1.5Fail
3.5AA Large
6.0AA
12.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ACACA6
2F2F2D
666567
8C8B8D
C9C9C7

Deuteranopia

AEB1A5
30312C
666767
8C8D8D
C9C9C7

Tritanopia

B9A3A2
342B2B
696665
8F8C8B
CAC7C7

Achromatopsia

A5A5A5
2D2D2D
646464
8A8A8A
C8C8C8

Shades & Tints Shades & Tints

#BB99AA

Dark
Light

#35282E

Dark
Light

#696169

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bb99aa;
  --color-2: #35282e;
  --color-3: #696169;
  --color-4: #8f878f;
  --color-5: #cac7c7;
}

SCSS

$color-1: #bb99aa;
$color-2: #35282e;
$color-3: #696169;
$color-4: #8f878f;
$color-5: #cac7c7;

TAILWIND

colors: {
  'brand-1': '#bb99aa',
  'brand-2': '#35282e',
  'brand-3': '#696169',
  'brand-4': '#8f878f',
  'brand-5': '#cac7c7',
}

RGB Array

[187, 153, 170], [53, 40, 46], [105, 97, 105], [143, 135, 143], [202, 199, 199]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This luxury-style palette of #BB99AA, #35282E, #696169, #8F878F, #CAC7C7 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #bb99aa; --color-2: #35282e; --color-3: #696169; --color-4: #8f878f; --color-5: #cac7c7. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 luxury-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