← Back to Editor

#55605C · #458285 · #36A4AE · #26C5D6 · #16E7FF

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

#55605C

Ink Gray · DimGray · Charcoal

HEX
#55605C
RGB
rgb(85, 96, 92)
HSL
hsl(158, 6%, 35%)
HSB
hsb(158, 11%, 38%)
CMYK
cmyk(11%, 0%, 4%, 62%)
Oklch
oklch(47.8% 0.015 171.8)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#458285

Slate Blue · SlateGray · Mint Ice

HEX
#458285
RGB
rgb(69, 130, 133)
HSL
hsl(183, 32%, 40%)
HSB
hsb(183, 48%, 52%)
CMYK
cmyk(48%, 2%, 0%, 48%)
Oklch
oklch(56.7% 0.063 199.7)

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

#36A4AE

Lake Blue · LightSeaGreen · Mint Ice

HEX
#36A4AE
RGB
rgb(54, 164, 174)
HSL
hsl(185, 53%, 45%)
HSB
hsb(185, 69%, 68%)
CMYK
cmyk(69%, 6%, 0%, 32%)
Oklch
oklch(66.2% 0.098 203.8)

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

#26C5D6

Lake Blue · MediumTurquoise · Mint Ice

HEX
#26C5D6
RGB
rgb(38, 197, 214)
HSL
hsl(186, 70%, 49%)
HSB
hsb(186, 82%, 84%)
CMYK
cmyk(82%, 8%, 0%, 16%)
Oklch
oklch(75.5% 0.123 206.4)

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

#16E7FF

Lake Blue · Cyan · Lake Green

HEX
#16E7FF
RGB
rgb(22, 231, 255)
HSL
hsl(186, 100%, 54%)
HSB
hsb(186, 91%, 100%)
CMYK
cmyk(91%, 9%, 0%, 0%)
Oklch
oklch(85.0% 0.144 208.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

55605C
5F5458

Analogous

545F55
55605C
545D5F

Triadic

55605C
5B545F
5F5B54

Split-Comp.

55605C
5F545D
5F5554

Tetradic

55605C
55545F
5F5458
5D5F54

Contrast Matrix WCAG 2.1 Contrast

55605C
458285
36A4AE
26C5D6
16E7FF
—
1.5
Fail
2.2
Fail
3.1
AA Large
4.3
AA Large
1.5
Fail
—
1.5
Fail
2.1
Fail
2.9
Fail
2.2
Fail
1.5
Fail
—
1.4
Fail
2.0
Fail
3.1
AA Large
2.1
Fail
1.4
Fail
—
1.4
Fail
4.3
AA Large
2.9
Fail
2.0
Fail
1.4
Fail
—
White BG
6.5AA
4.4AA Large
3.0Fail
2.1Fail
1.5Fail
Black BG
3.2AA Large
4.8AA
7.1AAA
10.0AAA
13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5A5A5D
5F6084
6667AC
6B6CD2
7072F9

Deuteranopia

59585D
5C5784
5F57AB
6256D1
6455F8

Tritanopia

565E5E
488484
3CAAA9
2ECFCE
20F5F4

Achromatopsia

5C5C5C
707070
848484
979797
ABABAB

Shades & Tints Shades & Tints

#55605C

Dark
Light

#458285

Dark
Light

#36A4AE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #55605c;
  --color-2: #458285;
  --color-3: #36a4ae;
  --color-4: #26c5d6;
  --color-5: #16e7ff;
}

SCSS

$color-1: #55605c;
$color-2: #458285;
$color-3: #36a4ae;
$color-4: #26c5d6;
$color-5: #16e7ff;

TAILWIND

colors: {
  'brand-1': '#55605c',
  'brand-2': '#458285',
  'brand-3': '#36a4ae',
  'brand-4': '#26c5d6',
  'brand-5': '#16e7ff',
}

RGB Array

[85, 96, 92], [69, 130, 133], [54, 164, 174], [38, 197, 214], [22, 231, 255]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #55605C, #458285, #36A4AE, #26C5D6, #16E7FF 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: #55605c; --color-2: #458285; --color-3: #36a4ae; --color-4: #26c5d6; --color-5: #16e7ff. 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