← Back to Editor

#82F3BF · #A5D0BC · #BDBAB2 · #FE1D95 · #606972

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

#82F3BF

Jade · LightGreen · Apple Green

HEX
#82F3BF
RGB
rgb(130, 243, 191)
HSL
hsl(152, 82%, 73%)
HSB
hsb(152, 47%, 95%)
CMYK
cmyk(47%, 0%, 21%, 5%)
Oklch
oklch(88.3% 0.128 162.3)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#A5D0BC

Jade · Silver · Apple Green

HEX
#A5D0BC
RGB
rgb(165, 208, 188)
HSL
hsl(152, 31%, 73%)
HSB
hsb(152, 21%, 82%)
CMYK
cmyk(21%, 0%, 10%, 18%)
Oklch
oklch(82.1% 0.053 165.1)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#BDBAB2

Goose Yellow · Silver · Pearl Gray

HEX
#BDBAB2
RGB
rgb(189, 186, 178)
HSL
hsl(44, 8%, 72%)
HSB
hsb(44, 6%, 74%)
CMYK
cmyk(0%, 2%, 6%, 26%)
Oklch
oklch(78.9% 0.012 89.7)

Traditional「Goose Yellow」· Paint「Pearl Gray」· Creative Silver Lining

#FE1D95

Rose Purple · DeepPink · Rose Pink

HEX
#FE1D95
RGB
rgb(254, 29, 149)
HSL
hsl(328, 99%, 55%)
HSB
hsb(328, 89%, 100%)
CMYK
cmyk(0%, 89%, 41%, 0%)
Oklch
oklch(65.7% 0.258 356.4)

Traditional「Rose Purple」· Paint「Rose Pink」· Creative Blush Sunrise

#606972

Indigo · DimGray · Warm Gray

HEX
#606972
RGB
rgb(96, 105, 114)
HSL
hsl(210, 9%, 41%)
HSB
hsb(210, 16%, 45%)
CMYK
cmyk(16%, 8%, 0%, 55%)
Oklch
oklch(51.6% 0.018 248.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

82F3BF
F382B6

Analogous

82F385
82F3BF
82EFF3

Triadic

82F3BF
BE82F3
F3BE82

Split-Comp.

82F3BF
F382EF
F38582

Tetradic

82F3BF
8582F3
F382B6
EFF382

Contrast Matrix WCAG 2.1 Contrast

82F3BF
A5D0BC
BDBAB2
FE1D95
606972
—
1.3
Fail
1.4
Fail
2.7
Fail
4.1
AA Large
1.3
Fail
—
1.1
Fail
2.1
Fail
3.3
AA Large
1.4
Fail
1.1
Fail
—
1.9
Fail
2.9
Fail
2.7
Fail
2.1
Fail
1.9
Fail
—
1.5
Fail
4.1
AA Large
3.3
AA Large
2.9
Fail
1.5
Fail
—
White BG
1.4Fail
1.7Fail
1.9Fail
3.6AA Large
5.6AA
Black BG
15.5AAA
12.3AAA
10.8AAA
5.8AA
3.8AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

B3B4CC
B8B8C1
BCBCB4
9D9B78
646470

Deuteranopia

ACA4CF
B5B2C2
BCBCB4
AABA71
63636F

Tritanopia

88D6D8
A7C5C6
BDB5B6
F3615C
606E6E

Achromatopsia

CBCBCB
C1C1C1
BABABA
6E6E6E
676767

Shades & Tints Shades & Tints

#82F3BF

Dark
Light

#A5D0BC

Dark
Light

#BDBAB2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #82f3bf;
  --color-2: #a5d0bc;
  --color-3: #bdbab2;
  --color-4: #fe1d95;
  --color-5: #606972;
}

SCSS

$color-1: #82f3bf;
$color-2: #a5d0bc;
$color-3: #bdbab2;
$color-4: #fe1d95;
$color-5: #606972;

TAILWIND

colors: {
  'brand-1': '#82f3bf',
  'brand-2': '#a5d0bc',
  'brand-3': '#bdbab2',
  'brand-4': '#fe1d95',
  'brand-5': '#606972',
}

RGB Array

[130, 243, 191], [165, 208, 188], [189, 186, 178], [254, 29, 149], [96, 105, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #82F3BF, #A5D0BC, #BDBAB2, #FE1D95, #606972 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: #82f3bf; --color-2: #a5d0bc; --color-3: #bdbab2; --color-4: #fe1d95; --color-5: #606972. 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