← Back to Editor

#483B4A · #4D615B · #51876B · #8DAF7C · #B6C681

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#483B4A

Dark Plum · DarkSlateGray · Eggplant

HEX
#483B4A
RGB
rgb(72, 59, 74)
HSL
hsl(292, 11%, 26%)
HSB
hsb(292, 20%, 29%)
CMYK
cmyk(3%, 20%, 0%, 71%)
Oklch
oklch(37.2% 0.031 321.8)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#4D615B

Mineral Blue · DimGray · Mint Ice

HEX
#4D615B
RGB
rgb(77, 97, 91)
HSL
hsl(162, 11%, 34%)
HSB
hsb(162, 21%, 38%)
CMYK
cmyk(21%, 0%, 6%, 62%)
Oklch
oklch(47.4% 0.026 174.9)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#51876B

Celadon · DimGray · Olive Green

HEX
#51876B
RGB
rgb(81, 135, 107)
HSL
hsl(149, 25%, 42%)
HSB
hsb(149, 40%, 53%)
CMYK
cmyk(40%, 0%, 21%, 47%)
Oklch
oklch(57.7% 0.073 160.4)

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

#8DAF7C

Celadon · DarkSeaGreen · Olive Green

HEX
#8DAF7C
RGB
rgb(141, 175, 124)
HSL
hsl(100, 24%, 59%)
HSB
hsb(100, 29%, 69%)
CMYK
cmyk(19%, 0%, 29%, 31%)
Oklch
oklch(71.5% 0.081 135.5)

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

#B6C681

Willow Green · Tan · Apple Green

HEX
#B6C681
RGB
rgb(182, 198, 129)
HSL
hsl(74, 38%, 64%)
HSB
hsb(74, 35%, 78%)
CMYK
cmyk(8%, 0%, 35%, 22%)
Oklch
oklch(79.8% 0.093 119.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

483B4A
3D4A3B

Analogous

403B4A
483B4A
4A3B44

Triadic

483B4A
4A483B
3B4A48

Split-Comp.

483B4A
444A3B
3B4A40

Tetradic

483B4A
4A403B
3D4A3B
3B444A

Contrast Matrix WCAG 2.1 Contrast

483B4A
4D615B
51876B
8DAF7C
B6C681
—
1.6
Fail
2.5
Fail
4.3
AA Large
5.7
AA
1.6
Fail
—
1.6
Fail
2.7
Fail
3.6
AA Large
2.5
Fail
1.6
Fail
—
1.7
Fail
2.3
Fail
4.3
AA Large
2.7
Fail
1.7
Fail
—
1.3
Fail
5.7
AA
3.6
AA Large
2.3
Fail
1.3
Fail
—
White BG
10.5AAA
6.6AA
4.2AA Large
2.5Fail
1.8Fail
Black BG
2.0Fail
3.2AA Large
5.0AA
8.6AAA
11.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

424246
56565C
686972
9C9C88
BDBD92

Deuteranopia

434446
55535D
656173
9A978B
BCBB96

Tritanopia

474443
4E5E5E
547778
8F9294
B79FA2

Achromatopsia

414141
5A5A5A
747474
9F9F9F
B9B9B9

Shades & Tints Shades & Tints

#483B4A

Dark
Light

#4D615B

Dark
Light

#51876B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #483b4a;
  --color-2: #4d615b;
  --color-3: #51876b;
  --color-4: #8daf7c;
  --color-5: #b6c681;
}

SCSS

$color-1: #483b4a;
$color-2: #4d615b;
$color-3: #51876b;
$color-4: #8daf7c;
$color-5: #b6c681;

TAILWIND

colors: {
  'brand-1': '#483b4a',
  'brand-2': '#4d615b',
  'brand-3': '#51876b',
  'brand-4': '#8daf7c',
  'brand-5': '#b6c681',
}

RGB Array

[72, 59, 74], [77, 97, 91], [81, 135, 107], [141, 175, 124], [182, 198, 129]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #483B4A, #4D615B, #51876B, #8DAF7C, #B6C681 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: #483b4a; --color-2: #4d615b; --color-3: #51876b; --color-4: #8daf7c; --color-5: #b6c681. 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