← Back to Editor

#595B5A · #0ACDA3 · #2BA8AC · #4489B2 · #6964B8

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

#595B5A

Ink Gray · DimGray · Charcoal

HEX
#595B5A
RGB
rgb(89, 91, 90)
HSL
hsl(150, 1%, 35%)
HSB
hsb(150, 2%, 36%)
CMYK
cmyk(2%, 0%, 1%, 64%)
Oklch
oklch(46.9% 0.003 165.0)

TraditionalInk Gray」· PaintCharcoal」· Creative Midnight Shadow

#0ACDA3

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#0ACDA3
RGB
rgb(10, 205, 163)
HSL
hsl(167, 91%, 42%)
HSB
hsb(167, 95%, 80%)
CMYK
cmyk(95%, 0%, 20%, 20%)
Oklch
oklch(75.6% 0.147 170.9)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#2BA8AC

Lake Blue · LightSeaGreen · Mint Ice

HEX
#2BA8AC
RGB
rgb(43, 168, 172)
HSL
hsl(182, 60%, 42%)
HSB
hsb(182, 75%, 67%)
CMYK
cmyk(75%, 2%, 0%, 33%)
Oklch
oklch(66.9% 0.104 198.2)

TraditionalLake Blue」· PaintMint Ice」· Creative Blush Sunrise

#4489B2

Slate Blue · SteelBlue · Navy Blue

HEX
#4489B2
RGB
rgb(68, 137, 178)
HSL
hsl(202, 45%, 48%)
HSB
hsb(202, 62%, 70%)
CMYK
cmyk(62%, 23%, 0%, 30%)
Oklch
oklch(60.3% 0.094 237.2)

TraditionalSlate Blue」· PaintNavy Blue」· Creative Blush Sunrise

#6964B8

Deep Indigo · SlateBlue · Navy Blue

HEX
#6964B8
RGB
rgb(105, 100, 184)
HSL
hsl(244, 37%, 56%)
HSB
hsb(244, 46%, 72%)
CMYK
cmyk(43%, 46%, 0%, 28%)
Oklch
oklch(54.7% 0.128 284.0)

TraditionalDeep Indigo」· PaintNavy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

595B5A
5A5859

Analogous

585A58
595B5A
585A5A

Triadic

595B5A
59585A
5A5958

Split-Comp.

595B5A
5A585A
5A5858

Tetradic

595B5A
58585A
5A5859
5A5A58

Contrast Matrix WCAG 2.1 Contrast

595B5A
0ACDA3
2BA8AC
4489B2
6964B8
3.3
AA Large
2.4
Fail
1.8
Fail
1.3
Fail
3.3
AA Large
1.4
Fail
1.9
Fail
2.5
Fail
2.4
Fail
1.4
Fail
1.3
Fail
1.8
Fail
1.8
Fail
1.9
Fail
1.3
Fail
1.3
Fail
1.3
Fail
2.5
Fail
1.8
Fail
1.3
Fail
White BG
6.8AA
2.0Fail
2.9Fail
3.8AA Large
5.1AA
Black BG
3.1AA Large
10.3AAA
7.3AAA
5.5AA
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

5A5A5A
5E60AD
6162AB
6262A8
6767A4

Deuteranopia

5A5A5A
5345B0
5A51AB
5E59A6
67689F

Tritanopia

595A5A
14B5B7
31AAAA
47A09F
699490

Achromatopsia

5A5A5A
8E8E8E
838383
797979
6F6F6F

Shades & Tints Shades & Tints

#595B5A

Dark
Light

#0ACDA3

Dark
Light

#2BA8AC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #595b5a;
  --color-2: #0acda3;
  --color-3: #2ba8ac;
  --color-4: #4489b2;
  --color-5: #6964b8;
}

SCSS

$color-1: #595b5a;
$color-2: #0acda3;
$color-3: #2ba8ac;
$color-4: #4489b2;
$color-5: #6964b8;

TAILWIND

colors: {
  'brand-1': '#595b5a',
  'brand-2': '#0acda3',
  'brand-3': '#2ba8ac',
  'brand-4': '#4489b2',
  'brand-5': '#6964b8',
}

RGB Array

[89, 91, 90], [10, 205, 163], [43, 168, 172], [68, 137, 178], [105, 100, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #595B5A, #0ACDA3, #2BA8AC, #4489B2, #6964B8 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: #595b5a; --color-2: #0acda3; --color-3: #2ba8ac; --color-4: #4489b2; --color-5: #6964b8. 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