← Back to Editor

#366958 · #55AA95 · #8ADFCC · #317B6C · #26314D

sea

A 5-color sea palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#366958

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#366958
RGB
rgb(54, 105, 88)
HSL
hsl(160, 32%, 31%)
HSB
hsb(160, 49%, 41%)
CMYK
cmyk(49%, 0%, 16%, 59%)
Oklch
oklch(48.0% 0.062 169.8)

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

#55AA95

Mineral Blue · CadetBlue · Mint Ice

HEX
#55AA95
RGB
rgb(85, 170, 149)
HSL
hsl(165, 33%, 50%)
HSB
hsb(165, 50%, 67%)
CMYK
cmyk(50%, 0%, 12%, 33%)
Oklch
oklch(67.9% 0.089 175.3)

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

#8ADFCC

Jade · SkyBlue · Lake Green

HEX
#8ADFCC
RGB
rgb(138, 223, 204)
HSL
hsl(167, 57%, 71%)
HSB
hsb(167, 38%, 87%)
CMYK
cmyk(38%, 0%, 9%, 13%)
Oklch
oklch(84.4% 0.087 178.2)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#317B6C

Mineral Blue · SeaGreen · Mint Ice

HEX
#317B6C
RGB
rgb(49, 123, 108)
HSL
hsl(168, 43%, 34%)
HSB
hsb(168, 60%, 48%)
CMYK
cmyk(60%, 0%, 12%, 52%)
Oklch
oklch(53.2% 0.077 177.6)

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

#26314D

Indigo · DarkSlateGray · Prussian Blue

HEX
#26314D
RGB
rgb(38, 49, 77)
HSL
hsl(223, 34%, 23%)
HSB
hsb(223, 51%, 30%)
CMYK
cmyk(51%, 36%, 0%, 70%)
Oklch
oklch(31.7% 0.053 267.1)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

366958
683647

Analogous

36683E
366958
366068

Triadic

366958
573668
685736

Split-Comp.

366958
683660
683E36

Tetradic

366958
3E3668
683647
606836

Contrast Matrix WCAG 2.1 Contrast

366958
55AA95
8ADFCC
317B6C
26314D
—
2.3
Fail
4.1
AA Large
1.3
Fail
2.0
Fail
2.3
Fail
—
1.8
Fail
1.8
Fail
4.6
AA
4.1
AA Large
1.8
Fail
—
3.2
AA Large
8.3
AAA
1.3
Fail
1.8
Fail
3.2
AA Large
—
2.6
Fail
2.0
Fail
4.6
AA
8.3
AAA
2.6
Fail
—
White BG
6.3AA
2.8Fail
1.6Fail
5.0AA
12.9AAA
Black BG
3.3AA Large
7.6AAA
13.5AAA
4.2AA Large
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4C4D5C
7A7B9A
AFB0D1
515270
2B2B46

Deuteranopia

49455D
756F9B
AAA4D2
4D4771
2A2945

Tritanopia

395F60
599E9F
8ED4D5
357273
274140

Achromatopsia

585858
8E8E8E
C3C3C3
636363
313131

Shades & Tints Shades & Tints

#366958

Dark
Light

#55AA95

Dark
Light

#8ADFCC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #366958;
  --color-2: #55aa95;
  --color-3: #8adfcc;
  --color-4: #317b6c;
  --color-5: #26314d;
}

SCSS

$color-1: #366958;
$color-2: #55aa95;
$color-3: #8adfcc;
$color-4: #317b6c;
$color-5: #26314d;

TAILWIND

colors: {
  'brand-1': '#366958',
  'brand-2': '#55aa95',
  'brand-3': '#8adfcc',
  'brand-4': '#317b6c',
  'brand-5': '#26314d',
}

RGB Array

[54, 105, 88], [85, 170, 149], [138, 223, 204], [49, 123, 108], [38, 49, 77]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #366958, #55AA95, #8ADFCC, #317B6C, #26314D is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #366958; --color-2: #55aa95; --color-3: #8adfcc; --color-4: #317b6c; --color-5: #26314d. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 sea-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