← Back to Editor

#67A1A3 · #48969C · #626182 · #81809F · #ABA0AB

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

#67A1A3

Slate Blue · CadetBlue · Lake Green

HEX
#67A1A3
RGB
rgb(103, 161, 163)
HSL
hsl(182, 25%, 52%)
HSB
hsb(182, 37%, 64%)
CMYK
cmyk(37%, 1%, 0%, 36%)
Oklch
oklch(67.0% 0.061 198.6)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

#48969C

Slate Blue · CadetBlue · Mint Ice

HEX
#48969C
RGB
rgb(72, 150, 156)
HSL
hsl(184, 37%, 45%)
HSB
hsb(184, 54%, 61%)
CMYK
cmyk(54%, 4%, 0%, 39%)
Oklch
oklch(62.6% 0.077 202.1)

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

#626182

Deep Indigo · DimGray · Navy Blue

HEX
#626182
RGB
rgb(98, 97, 130)
HSL
hsl(242, 15%, 45%)
HSB
hsb(242, 25%, 51%)
CMYK
cmyk(25%, 25%, 0%, 49%)
Oklch
oklch(50.6% 0.052 285.8)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#81809F

Deep Indigo · LightSlateGray · Navy Blue

HEX
#81809F
RGB
rgb(129, 128, 159)
HSL
hsl(242, 14%, 56%)
HSB
hsb(242, 19%, 62%)
CMYK
cmyk(19%, 19%, 0%, 38%)
Oklch
oklch(61.2% 0.047 286.4)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#ABA0AB

Ash · DarkGray · Silver Sand

HEX
#ABA0AB
RGB
rgb(171, 160, 171)
HSL
hsl(300, 6%, 65%)
HSB
hsb(300, 6%, 67%)
CMYK
cmyk(0%, 6%, 0%, 33%)
Oklch
oklch(71.8% 0.020 325.8)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

67A1A3
A36866

Analogous

66A387
67A1A3
6683A3

Triadic

67A1A3
A366A1
A1A366

Split-Comp.

67A1A3
A36683
A38766

Tetradic

67A1A3
8766A3
A36866
83A366

Contrast Matrix WCAG 2.1 Contrast

67A1A3
48969C
626182
81809F
ABA0AB
—
1.2
Fail
2.0
Fail
1.3
Fail
1.2
Fail
1.2
Fail
—
1.7
Fail
1.1
Fail
1.4
Fail
2.0
Fail
1.7
Fail
—
1.6
Fail
2.4
Fail
1.3
Fail
1.1
Fail
1.6
Fail
—
1.5
Fail
1.2
Fail
1.4
Fail
2.4
Fail
1.5
Fail
—
White BG
2.9Fail
3.4AA Large
5.9AA
3.8AA Large
2.5Fail
Black BG
7.2AAA
6.1AA
3.6AA Large
5.5AA
8.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8081A3
6A6A9B
62627A
818197
A6A6A8

Deuteranopia

7D78A2
655F9A
626278
818196
A7A8A8

Tritanopia

6AA2A2
4C9999
627472
819290
AAA6A6

Achromatopsia

909090
7F7F7F
656565
848484
A5A5A5

Shades & Tints Shades & Tints

#67A1A3

Dark
Light

#48969C

Dark
Light

#626182

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #67a1a3;
  --color-2: #48969c;
  --color-3: #626182;
  --color-4: #81809f;
  --color-5: #aba0ab;
}

SCSS

$color-1: #67a1a3;
$color-2: #48969c;
$color-3: #626182;
$color-4: #81809f;
$color-5: #aba0ab;

TAILWIND

colors: {
  'brand-1': '#67a1a3',
  'brand-2': '#48969c',
  'brand-3': '#626182',
  'brand-4': '#81809f',
  'brand-5': '#aba0ab',
}

RGB Array

[103, 161, 163], [72, 150, 156], [98, 97, 130], [129, 128, 159], [171, 160, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #67A1A3, #48969C, #626182, #81809F, #ABA0AB 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: #67a1a3; --color-2: #48969c; --color-3: #626182; --color-4: #81809f; --color-5: #aba0ab. 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