← Back to Editor

#53827F · #658C89 · #769792 · #87A19B · #99ACA5

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

#53827F

Mineral Blue · SlateGray · Mint Ice

HEX
#53827F
RGB
rgb(83, 130, 127)
HSL
hsl(176, 22%, 42%)
HSB
hsb(176, 36%, 51%)
CMYK
cmyk(36%, 0%, 2%, 49%)
Oklch
oklch(57.2% 0.051 190.7)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#658C89

Mineral Blue · SlateGray · Mint Ice

HEX
#658C89
RGB
rgb(101, 140, 137)
HSL
hsl(175, 16%, 47%)
HSB
hsb(175, 28%, 55%)
CMYK
cmyk(28%, 0%, 2%, 45%)
Oklch
oklch(61.0% 0.043 190.1)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#769792

Mineral Blue · LightSlateGray · Lake Green

HEX
#769792
RGB
rgb(118, 151, 146)
HSL
hsl(171, 14%, 53%)
HSB
hsb(171, 22%, 59%)
CMYK
cmyk(22%, 0%, 3%, 41%)
Oklch
oklch(65.0% 0.037 184.9)

TraditionalMineral Blue」· PaintLake Green」· Creative Blush Sunrise

#87A19B

Mineral Blue · LightSlateGray · Lake Green

HEX
#87A19B
RGB
rgb(135, 161, 155)
HSL
hsl(166, 12%, 58%)
HSB
hsb(166, 16%, 63%)
CMYK
cmyk(16%, 0%, 4%, 37%)
Oklch
oklch(68.7% 0.030 179.8)

TraditionalMineral Blue」· PaintLake Green」· Creative Blush Sunrise

#99ACA5

Jade · DarkGray · Apple Green

HEX
#99ACA5
RGB
rgb(153, 172, 165)
HSL
hsl(158, 10%, 64%)
HSB
hsb(158, 11%, 67%)
CMYK
cmyk(11%, 0%, 4%, 33%)
Oklch
oklch(72.8% 0.023 171.5)

TraditionalJade」· PaintApple Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

53827F
835457

Analogous

548368
53827F
546E83

Triadic

53827F
805483
838054

Split-Comp.

53827F
83546E
836854

Tetradic

53827F
685483
835457
6E8354

Contrast Matrix WCAG 2.1 Contrast

53827F
658C89
769792
87A19B
99ACA5
1.2
Fail
1.4
Fail
1.6
Fail
1.8
Fail
1.2
Fail
1.2
Fail
1.3
Fail
1.6
Fail
1.4
Fail
1.2
Fail
1.1
Fail
1.3
Fail
1.6
Fail
1.3
Fail
1.1
Fail
1.2
Fail
1.8
Fail
1.6
Fail
1.3
Fail
1.2
Fail
White BG
4.3AA Large
3.7AA Large
3.2AA Large
2.8Fail
2.4Fail
Black BG
4.9AA
5.7AA
6.6AA
7.6AAA
8.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

676880
76768A
848593
92929C
A1A1A7

Deuteranopia

656180
74718A
828094
918F9D
A09FA7

Tritanopia

558080
678A8A
789494
889E9E
9AA8A8

Achromatopsia

747474
808080
8D8D8D
999999
A6A6A6

Shades & Tints Shades & Tints

#53827F

Dark
Light

#658C89

Dark
Light

#769792

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #53827f;
  --color-2: #658c89;
  --color-3: #769792;
  --color-4: #87a19b;
  --color-5: #99aca5;
}

SCSS

$color-1: #53827f;
$color-2: #658c89;
$color-3: #769792;
$color-4: #87a19b;
$color-5: #99aca5;

TAILWIND

colors: {
  'brand-1': '#53827f',
  'brand-2': '#658c89',
  'brand-3': '#769792',
  'brand-4': '#87a19b',
  'brand-5': '#99aca5',
}

RGB Array

[83, 130, 127], [101, 140, 137], [118, 151, 146], [135, 161, 155], [153, 172, 165]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #53827F, #658C89, #769792, #87A19B, #99ACA5 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: #53827f; --color-2: #658c89; --color-3: #769792; --color-4: #87a19b; --color-5: #99aca5. 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