← Back to Editor

#B2BF7C · #638255 · #789E85 · #ACB392 · #B3B150

muted

A 5-color muted 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

#B2BF7C

Willow Green · Tan · Apple Green

HEX
#B2BF7C
RGB
rgb(178, 191, 124)
HSL
hsl(72, 34%, 62%)
HSB
hsb(72, 35%, 75%)
CMYK
cmyk(7%, 0%, 35%, 25%)
Oklch
oklch(77.9% 0.090 117.5)

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

#638255

Celadon · DimGray · Olive Green

HEX
#638255
RGB
rgb(99, 130, 85)
HSL
hsl(101, 21%, 42%)
HSB
hsb(101, 35%, 51%)
CMYK
cmyk(24%, 0%, 35%, 49%)
Oklch
oklch(57.1% 0.076 136.3)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#789E85

Celadon · LightSlateGray · Olive Green

HEX
#789E85
RGB
rgb(120, 158, 133)
HSL
hsl(141, 16%, 55%)
HSB
hsb(141, 24%, 62%)
CMYK
cmyk(24%, 0%, 16%, 38%)
Oklch
oklch(66.4% 0.056 155.8)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#ACB392

Willow Green · DarkGray · Apple Green

HEX
#ACB392
RGB
rgb(172, 179, 146)
HSL
hsl(73, 18%, 64%)
HSB
hsb(73, 18%, 70%)
CMYK
cmyk(4%, 0%, 18%, 30%)
Oklch
oklch(75.2% 0.046 117.3)

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

#B3B150

Autumn Sage · GoldenRod · Sunflower

HEX
#B3B150
RGB
rgb(179, 177, 80)
HSL
hsl(59, 39%, 51%)
HSB
hsb(59, 55%, 70%)
CMYK
cmyk(0%, 1%, 55%, 30%)
Oklch
oklch(74.2% 0.120 107.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B2BF7C
8A7DBF

Analogous

BFAB7D
B2BF7C
91BF7D

Triadic

B2BF7C
7DB2BF
BF7DB2

Split-Comp.

B2BF7C
7D91BF
AB7DBF

Tetradic

B2BF7C
7DBFAB
8A7DBF
BF7D91

Contrast Matrix WCAG 2.1 Contrast

B2BF7C
638255
789E85
ACB392
B3B150
—
2.2
Fail
1.5
Fail
1.1
Fail
1.1
Fail
2.2
Fail
—
1.4
Fail
2.0
Fail
1.9
Fail
1.5
Fail
1.4
Fail
—
1.4
Fail
1.3
Fail
1.1
Fail
2.0
Fail
1.4
Fail
—
1.0
Fail
1.1
Fail
1.9
Fail
1.3
Fail
1.0
Fail
—
White BG
2.0Fail
4.3AA Large
3.0Fail
2.2Fail
2.3Fail
Black BG
10.6AAA
4.9AA
7.0AAA
9.6AAA
9.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B8B88C
707160
88898B
AFAF9A
B2B267

Deuteranopia

B7B690
6F6C63
86838D
AFAE9C
B2B26D

Tritanopia

B3999C
65686A
7A9091
ACA0A2
B37A7E

Achromatopsia

B3B3B3
747474
909090
ADADAD
A7A7A7

Shades & Tints Shades & Tints

#B2BF7C

Dark
Light

#638255

Dark
Light

#789E85

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b2bf7c;
  --color-2: #638255;
  --color-3: #789e85;
  --color-4: #acb392;
  --color-5: #b3b150;
}

SCSS

$color-1: #b2bf7c;
$color-2: #638255;
$color-3: #789e85;
$color-4: #acb392;
$color-5: #b3b150;

TAILWIND

colors: {
  'brand-1': '#b2bf7c',
  'brand-2': '#638255',
  'brand-3': '#789e85',
  'brand-4': '#acb392',
  'brand-5': '#b3b150',
}

RGB Array

[178, 191, 124], [99, 130, 85], [120, 158, 133], [172, 179, 146], [179, 177, 80]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This muted-style palette of #B2BF7C, #638255, #789E85, #ACB392, #B3B150 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: #b2bf7c; --color-2: #638255; --color-3: #789e85; --color-4: #acb392; --color-5: #b3b150. 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 muted-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