← Back to Editor

#BFB2B2 · #DE9730 · #AAA8BF · #7BB8B0 · #ADADAD

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

#BFB2B2

Peach Pink · Silver · Pearl Gray

HEX
#BFB2B2
RGB
rgb(191, 178, 178)
HSL
hsl(0, 9%, 72%)
HSB
hsb(0, 7%, 75%)
CMYK
cmyk(0%, 7%, 7%, 25%)
Oklch
oklch(77.4% 0.015 17.5)

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

#DE9730

Ginger · GoldenRod · Warm Sun

HEX
#DE9730
RGB
rgb(222, 151, 48)
HSL
hsl(36, 73%, 53%)
HSB
hsb(36, 78%, 87%)
CMYK
cmyk(0%, 32%, 78%, 13%)
Oklch
oklch(73.0% 0.140 71.4)

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

#AAA8BF

Wisteria · DarkGray · Cobalt Blue

HEX
#AAA8BF
RGB
rgb(170, 168, 191)
HSL
hsl(245, 15%, 70%)
HSB
hsb(245, 12%, 75%)
CMYK
cmyk(11%, 12%, 0%, 25%)
Oklch
oklch(74.1% 0.033 289.6)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#7BB8B0

Mineral Blue · MediumAquaMarine · Lake Green

HEX
#7BB8B0
RGB
rgb(123, 184, 176)
HSL
hsl(172, 30%, 60%)
HSB
hsb(172, 33%, 72%)
CMYK
cmyk(33%, 0%, 4%, 28%)
Oklch
oklch(73.9% 0.064 185.6)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#ADADAD

Ash · DarkGray · Silver Sand

HEX
#ADADAD
RGB
rgb(173, 173, 173)
HSL
hsl(0, 0%, 68%)
HSB
hsb(0, 0%, 68%)
CMYK
cmyk(0%, 0%, 0%, 32%)
Oklch
oklch(74.8% 0.000 89.9)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BFB2B2
B1BEBE

Analogous

BEB1B8
BFB2B2
BEB8B1

Triadic

BFB2B2
B1BEB1
B1B1BE

Split-Comp.

BFB2B2
B1BEB8
B1B8BE

Tetradic

BFB2B2
B8BEB1
B1BEBE
B8B1BE

Contrast Matrix WCAG 2.1 Contrast

BFB2B2
DE9730
AAA8BF
7BB8B0
ADADAD
—
1.2
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.2
Fail
—
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
—
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
—
White BG
2.1Fail
2.4Fail
2.3Fail
2.3Fail
2.2Fail
Black BG
10.2AAA
8.6AAA
9.1AAA
9.3AAA
9.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B9B2
BFBF49
A9A9B9
9596B2
ADADAD

Deuteranopia

BABBB2
C3C94F
A9A9B8
928DB2
ADADAD

Tritanopia

BEB2B2
DA5D61
AAB5B4
7EB3B4
ADADAD

Achromatopsia

B6B6B6
A0A0A0
ABABAB
A5A5A5
ADADAD

Shades & Tints Shades & Tints

#BFB2B2

Dark
Light

#DE9730

Dark
Light

#AAA8BF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bfb2b2;
  --color-2: #de9730;
  --color-3: #aaa8bf;
  --color-4: #7bb8b0;
  --color-5: #adadad;
}

SCSS

$color-1: #bfb2b2;
$color-2: #de9730;
$color-3: #aaa8bf;
$color-4: #7bb8b0;
$color-5: #adadad;

TAILWIND

colors: {
  'brand-1': '#bfb2b2',
  'brand-2': '#de9730',
  'brand-3': '#aaa8bf',
  'brand-4': '#7bb8b0',
  'brand-5': '#adadad',
}

RGB Array

[191, 178, 178], [222, 151, 48], [170, 168, 191], [123, 184, 176], [173, 173, 173]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BFB2B2, #DE9730, #AAA8BF, #7BB8B0, #ADADAD 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: #bfb2b2; --color-2: #de9730; --color-3: #aaa8bf; --color-4: #7bb8b0; --color-5: #adadad. 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