← Back to Editor

#B6FFF3 · #B7DB91 · #B7CA73 · #B7B955 · #B7A837

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

#B6FFF3

Jade · LightBlue · Glacier Blue

HEX
#B6FFF3
RGB
rgb(182, 255, 243)
HSL
hsl(170, 100%, 86%)
HSB
hsb(170, 29%, 100%)
CMYK
cmyk(29%, 0%, 5%, 0%)
Oklch
oklch(94.9% 0.074 183.4)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#B7DB91

Willow Green · LightGreen · Apple Green

HEX
#B7DB91
RGB
rgb(183, 219, 145)
HSL
hsl(89, 51%, 71%)
HSB
hsb(89, 34%, 86%)
CMYK
cmyk(16%, 0%, 34%, 14%)
Oklch
oklch(84.8% 0.105 129.5)

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

#B7CA73

Willow Green · Tan · Apple Green

HEX
#B7CA73
RGB
rgb(183, 202, 115)
HSL
hsl(73, 45%, 62%)
HSB
hsb(73, 43%, 79%)
CMYK
cmyk(9%, 0%, 43%, 21%)
Oklch
oklch(80.5% 0.114 119.1)

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

#B7B955

Autumn Sage · Tan · Sunflower

HEX
#B7B955
RGB
rgb(183, 185, 85)
HSL
hsl(61, 42%, 53%)
HSB
hsb(61, 54%, 73%)
CMYK
cmyk(1%, 0%, 54%, 27%)
Oklch
oklch(76.4% 0.123 110.0)

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

#B7A837

Autumn Sage · GoldenRod · Honey Gold

HEX
#B7A837
RGB
rgb(183, 168, 55)
HSL
hsl(53, 54%, 47%)
HSB
hsb(53, 70%, 72%)
CMYK
cmyk(0%, 8%, 70%, 28%)
Oklch
oklch(72.4% 0.131 101.6)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B6FFF3
FFB8C4

Analogous

B8FFCF
B6FFF3
B8E7FF

Triadic

B6FFF3
F3B8FF
FFF3B8

Split-Comp.

B6FFF3
FFB8E7
FFCFB8

Tetradic

B6FFF3
CFB8FF
FFB8C4
E7FFB8

Contrast Matrix WCAG 2.1 Contrast

B6FFF3
B7DB91
B7CA73
B7B955
B7A837
—
1.4
Fail
1.6
Fail
1.8
Fail
2.1
Fail
1.4
Fail
—
1.2
Fail
1.3
Fail
1.6
Fail
1.6
Fail
1.2
Fail
—
1.2
Fail
1.4
Fail
1.8
Fail
1.3
Fail
1.2
Fail
—
1.2
Fail
2.1
Fail
1.6
Fail
1.4
Fail
1.2
Fail
—
White BG
1.1Fail
1.5Fail
1.8Fail
2.1Fail
2.4Fail
Black BG
18.6AAA
13.6AAA
11.7AAA
10.1AAA
8.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D6D6F6
C7C7A3
BFBF88
B8B86D
B1B052

Deuteranopia

D1CCF7
C5C2A7
BEBD8D
B8B873
B1B359

Tritanopia

BAF8F9
B9B1B4
B8999C
B78085
B6686D

Achromatopsia

E8E8E8
C8C8C8
BABABA
ADADAD
A0A0A0

Shades & Tints Shades & Tints

#B6FFF3

Dark
Light

#B7DB91

Dark
Light

#B7CA73

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b6fff3;
  --color-2: #b7db91;
  --color-3: #b7ca73;
  --color-4: #b7b955;
  --color-5: #b7a837;
}

SCSS

$color-1: #b6fff3;
$color-2: #b7db91;
$color-3: #b7ca73;
$color-4: #b7b955;
$color-5: #b7a837;

TAILWIND

colors: {
  'brand-1': '#b6fff3',
  'brand-2': '#b7db91',
  'brand-3': '#b7ca73',
  'brand-4': '#b7b955',
  'brand-5': '#b7a837',
}

RGB Array

[182, 255, 243], [183, 219, 145], [183, 202, 115], [183, 185, 85], [183, 168, 55]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B6FFF3, #B7DB91, #B7CA73, #B7B955, #B7A837 is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #b6fff3; --color-2: #b7db91; --color-3: #b7ca73; --color-4: #b7b955; --color-5: #b7a837. 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. 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