← Back to Editor

#417D80 · #588278 · #829983 · #8DA36F · #819650

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

#417D80

Slate Blue · SeaGreen · Mint Ice

HEX
#417D80
RGB
rgb(65, 125, 128)
HSL
hsl(183, 33%, 38%)
HSB
hsb(183, 49%, 50%)
CMYK
cmyk(49%, 2%, 0%, 50%)
Oklch
oklch(55.1% 0.063 199.8)

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

#588278

Mineral Blue · DimGray · Mint Ice

HEX
#588278
RGB
rgb(88, 130, 120)
HSL
hsl(166, 19%, 43%)
HSB
hsb(166, 32%, 51%)
CMYK
cmyk(32%, 0%, 8%, 49%)
Oklch
oklch(57.3% 0.049 177.9)

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

#829983

Celadon · Gray · Olive Green

HEX
#829983
RGB
rgb(130, 153, 131)
HSL
hsl(123, 10%, 55%)
HSB
hsb(123, 15%, 60%)
CMYK
cmyk(15%, 0%, 14%, 40%)
Oklch
oklch(65.9% 0.041 146.3)

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

#8DA36F

Grass Green · DarkSeaGreen · Olive Green

HEX
#8DA36F
RGB
rgb(141, 163, 111)
HSL
hsl(85, 22%, 54%)
HSB
hsb(85, 32%, 64%)
CMYK
cmyk(13%, 0%, 32%, 36%)
Oklch
oklch(68.5% 0.077 127.0)

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

#819650

Grass Green · Gray · Olive Green

HEX
#819650
RGB
rgb(129, 150, 80)
HSL
hsl(78, 30%, 45%)
HSB
hsb(78, 47%, 59%)
CMYK
cmyk(14%, 0%, 47%, 41%)
Oklch
oklch(64.0% 0.098 122.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

417D80
814441

Analogous

418164
417D80
415E81

Triadic

417D80
81417E
7E8141

Split-Comp.

417D80
81415E
816441

Tetradic

417D80
644181
814441
5E8141

Contrast Matrix WCAG 2.1 Contrast

417D80
588278
829983
8DA36F
819650
—
1.1
Fail
1.5
Fail
1.7
Fail
1.4
Fail
1.1
Fail
—
1.4
Fail
1.6
Fail
1.3
Fail
1.5
Fail
1.4
Fail
—
1.1
Fail
1.1
Fail
1.7
Fail
1.6
Fail
1.1
Fail
—
1.2
Fail
1.4
Fail
1.3
Fail
1.1
Fail
1.2
Fail
—
White BG
4.7AA
4.3AA Large
3.1AA Large
2.8Fail
3.3AA Large
Black BG
4.5AA Large
4.9AA
6.8AA
7.6AAA
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5C7F
6A6B7A
8C8C88
97977C
8A8A61

Deuteranopia

58537F
68657B
8B898A
95947F
898765

Tritanopia

447F7F
5A7C7D
838D8D
8E8688
826E71

Achromatopsia

6B6B6B
747474
909090
969696
888888

Shades & Tints Shades & Tints

#417D80

Dark
Light

#588278

Dark
Light

#829983

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #417d80;
  --color-2: #588278;
  --color-3: #829983;
  --color-4: #8da36f;
  --color-5: #819650;
}

SCSS

$color-1: #417d80;
$color-2: #588278;
$color-3: #829983;
$color-4: #8da36f;
$color-5: #819650;

TAILWIND

colors: {
  'brand-1': '#417d80',
  'brand-2': '#588278',
  'brand-3': '#829983',
  'brand-4': '#8da36f',
  'brand-5': '#819650',
}

RGB Array

[65, 125, 128], [88, 130, 120], [130, 153, 131], [141, 163, 111], [129, 150, 80]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #417D80, #588278, #829983, #8DA36F, #819650 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: #417d80; --color-2: #588278; --color-3: #829983; --color-4: #8da36f; --color-5: #819650. 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