← Back to Editor

#B6D295 · #B0BC8E · #81A58B · #A28C7F · #B77F80

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

#B6D295

Willow Green · Tan · Apple Green

HEX
#B6D295
RGB
rgb(182, 210, 149)
HSL
hsl(88, 40%, 70%)
HSB
hsb(88, 29%, 82%)
CMYK
cmyk(13%, 0%, 29%, 18%)
Oklch
oklch(82.8% 0.087 128.2)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#B0BC8E

Willow Green · DarkSeaGreen · Apple Green

HEX
#B0BC8E
RGB
rgb(176, 188, 142)
HSL
hsl(76, 26%, 65%)
HSB
hsb(76, 24%, 74%)
CMYK
cmyk(6%, 0%, 24%, 26%)
Oklch
oklch(77.4% 0.064 119.8)

TraditionalWillow Green」· PaintApple Green」· Creative Mint Breeze

#81A58B

Celadon · DarkSeaGreen · Olive Green

HEX
#81A58B
RGB
rgb(129, 165, 139)
HSL
hsl(137, 17%, 58%)
HSB
hsb(137, 22%, 65%)
CMYK
cmyk(22%, 0%, 16%, 35%)
Oklch
oklch(68.8% 0.055 153.4)

TraditionalCeladon」· PaintOlive Green」· Creative Blush Sunrise

#A28C7F

Tangerine · Gray · Warm Sun

HEX
#A28C7F
RGB
rgb(162, 140, 127)
HSL
hsl(22, 16%, 57%)
HSB
hsb(22, 22%, 64%)
CMYK
cmyk(0%, 14%, 22%, 36%)
Oklch
oklch(65.6% 0.033 52.5)

TraditionalTangerine」· PaintWarm Sun」· Creative Blush Sunrise

#B77F80

Peach Pink · Gray · Coral Red

HEX
#B77F80
RGB
rgb(183, 127, 128)
HSL
hsl(359, 28%, 61%)
HSB
hsb(359, 31%, 72%)
CMYK
cmyk(0%, 31%, 30%, 28%)
Oklch
oklch(65.3% 0.070 18.0)

TraditionalPeach Pink」· PaintCoral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B6D295
B094D1

Analogous

D1CF94
B6D295
96D194

Triadic

B6D295
94B5D1
D194B5

Split-Comp.

B6D295
9496D1
CF94D1

Tetradic

B6D295
94D1CF
B094D1
D19496

Contrast Matrix WCAG 2.1 Contrast

B6D295
B0BC8E
81A58B
A28C7F
B77F80
1.2
Fail
1.6
Fail
1.9
Fail
2.0
Fail
1.2
Fail
1.4
Fail
1.6
Fail
1.6
Fail
1.6
Fail
1.4
Fail
1.2
Fail
1.2
Fail
1.9
Fail
1.6
Fail
1.2
Fail
1.0
Fail
2.0
Fail
1.6
Fail
1.2
Fail
1.0
Fail
White BG
1.7Fail
2.0Fail
2.7Fail
3.2AA Large
3.3AA Large
Black BG
12.6AAA
10.4AAA
7.7AAA
6.6AA
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C2A4
B5B599
919191
989882
9F9E80

Deuteranopia

C1BEA7
B5B49C
8F8C93
9A9B83
A2A680

Tritanopia

B7AFB2
B1A2A4
839697
A18585
B48080

Achromatopsia

C3C3C3
B3B3B3
979797
919191
909090

Shades & Tints Shades & Tints

#B6D295

Dark
Light

#B0BC8E

Dark
Light

#81A58B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b6d295;
  --color-2: #b0bc8e;
  --color-3: #81a58b;
  --color-4: #a28c7f;
  --color-5: #b77f80;
}

SCSS

$color-1: #b6d295;
$color-2: #b0bc8e;
$color-3: #81a58b;
$color-4: #a28c7f;
$color-5: #b77f80;

TAILWIND

colors: {
  'brand-1': '#b6d295',
  'brand-2': '#b0bc8e',
  'brand-3': '#81a58b',
  'brand-4': '#a28c7f',
  'brand-5': '#b77f80',
}

RGB Array

[182, 210, 149], [176, 188, 142], [129, 165, 139], [162, 140, 127], [183, 127, 128]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B6D295, #B0BC8E, #81A58B, #A28C7F, #B77F80 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: #b6d295; --color-2: #b0bc8e; --color-3: #81a58b; --color-4: #a28c7f; --color-5: #b77f80. 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