← Back to Editor

#BEBF9F · #9CAB91 · #818F8F · #60686E · #574852

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

#BEBF9F

Fresh Green · Tan · Sunflower

HEX
#BEBF9F
RGB
rgb(190, 191, 159)
HSL
hsl(62, 20%, 69%)
HSB
hsb(62, 17%, 75%)
CMYK
cmyk(1%, 0%, 17%, 25%)
Oklch
oklch(79.5% 0.044 108.8)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#9CAB91

Celadon · DarkSeaGreen · Apple Green

HEX
#9CAB91
RGB
rgb(156, 171, 145)
HSL
hsl(95, 13%, 62%)
HSB
hsb(95, 15%, 67%)
CMYK
cmyk(9%, 0%, 15%, 33%)
Oklch
oklch(72.2% 0.040 132.0)

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

#818F8F

Ash · LightSlateGray · Warm Gray

HEX
#818F8F
RGB
rgb(129, 143, 143)
HSL
hsl(180, 6%, 53%)
HSB
hsb(180, 10%, 56%)
CMYK
cmyk(10%, 0%, 0%, 44%)
Oklch
oklch(63.9% 0.016 196.8)

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

#60686E

Ink Gray · DimGray · Charcoal

HEX
#60686E
RGB
rgb(96, 104, 110)
HSL
hsl(206, 7%, 40%)
HSB
hsb(206, 13%, 43%)
CMYK
cmyk(13%, 5%, 0%, 57%)
Oklch
oklch(51.2% 0.014 240.1)

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

#574852

Rose Purple · DarkSlateGray · Charcoal

HEX
#574852
RGB
rgb(87, 72, 82)
HSL
hsl(320, 9%, 31%)
HSB
hsb(320, 17%, 34%)
CMYK
cmyk(0%, 17%, 6%, 66%)
Oklch
oklch(42.1% 0.026 338.4)

Traditional「Rose Purple」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BEBF9F
A1A0C0

Analogous

C0B1A0
BEBF9F
AFC0A0

Triadic

BEBF9F
A0BFC0
C0A0BF

Split-Comp.

BEBF9F
A0AFC0
B1A0C0

Tetradic

BEBF9F
A0C0B1
A1A0C0
C0A0AF

Contrast Matrix WCAG 2.1 Contrast

BEBF9F
9CAB91
818F8F
60686E
574852
—
1.3
Fail
1.8
Fail
3.0
AA Large
4.5
AA
1.3
Fail
—
1.4
Fail
2.3
Fail
3.5
AA Large
1.8
Fail
1.4
Fail
—
1.7
Fail
2.6
Fail
3.0
AA Large
2.3
Fail
1.7
Fail
—
1.5
Fail
4.5
AA
3.5
AA Large
2.6
Fail
1.5
Fail
—
White BG
1.9Fail
2.4Fail
3.4AA Large
5.7AA
8.6AAA
Black BG
11.1AAA
8.6AAA
6.3AA
3.7AA Large
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BEBEA7
A2A397
87878F
63646D
515050

Deuteranopia

BEBEA9
A2A199
86858F
63626C
51534F

Tritanopia

BEADAE
9D9C9D
828F8F
606B6B
564E4D

Achromatopsia

BBBBBB
A4A4A4
8B8B8B
666666
4E4E4E

Shades & Tints Shades & Tints

#BEBF9F

Dark
Light

#9CAB91

Dark
Light

#818F8F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bebf9f;
  --color-2: #9cab91;
  --color-3: #818f8f;
  --color-4: #60686e;
  --color-5: #574852;
}

SCSS

$color-1: #bebf9f;
$color-2: #9cab91;
$color-3: #818f8f;
$color-4: #60686e;
$color-5: #574852;

TAILWIND

colors: {
  'brand-1': '#bebf9f',
  'brand-2': '#9cab91',
  'brand-3': '#818f8f',
  'brand-4': '#60686e',
  'brand-5': '#574852',
}

RGB Array

[190, 191, 159], [156, 171, 145], [129, 143, 143], [96, 104, 110], [87, 72, 82]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BEBF9F, #9CAB91, #818F8F, #60686E, #574852 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: #bebf9f; --color-2: #9cab91; --color-3: #818f8f; --color-4: #60686e; --color-5: #574852. 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