← Back to Editor

#3A374C · #5D6C7D · #8BBEBB · #9EE0D6 · #C4E9DD

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

#3A374C

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#3A374C
RGB
rgb(58, 55, 76)
HSL
hsl(249, 16%, 26%)
HSB
hsb(249, 28%, 30%)
CMYK
cmyk(24%, 28%, 0%, 70%)
Oklch
oklch(34.9% 0.036 290.9)

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

#5D6C7D

Indigo · DimGray · Navy Blue

HEX
#5D6C7D
RGB
rgb(93, 108, 125)
HSL
hsl(212, 15%, 43%)
HSB
hsb(212, 26%, 49%)
CMYK
cmyk(26%, 14%, 0%, 51%)
Oklch
oklch(52.5% 0.032 251.7)

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

#8BBEBB

Jade · DarkGray · Lake Green

HEX
#8BBEBB
RGB
rgb(139, 190, 187)
HSL
hsl(176, 28%, 65%)
HSB
hsb(176, 27%, 75%)
CMYK
cmyk(27%, 0%, 2%, 25%)
Oklch
oklch(76.5% 0.054 191.5)

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

#9EE0D6

Jade · LightBlue · Lake Green

HEX
#9EE0D6
RGB
rgb(158, 224, 214)
HSL
hsl(171, 52%, 75%)
HSB
hsb(171, 29%, 88%)
CMYK
cmyk(29%, 0%, 4%, 12%)
Oklch
oklch(86.0% 0.068 184.3)

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

#C4E9DD

Jade · LightGray · Glacier Blue

HEX
#C4E9DD
RGB
rgb(196, 233, 221)
HSL
hsl(161, 46%, 84%)
HSB
hsb(161, 16%, 91%)
CMYK
cmyk(16%, 0%, 5%, 9%)
Oklch
oklch(90.4% 0.042 173.7)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3A374C
4A4D38

Analogous

383F4D
3A374C
45384D

Triadic

3A374C
4D3B38
384D3B

Split-Comp.

3A374C
4D4538
3F4D38

Tetradic

3A374C
4D383F
4A4D38
384D45

Contrast Matrix WCAG 2.1 Contrast

3A374C
5D6C7D
8BBEBB
9EE0D6
C4E9DD
—
2.1
Fail
5.6
AA
7.7
AAA
8.8
AAA
2.1
Fail
—
2.6
Fail
3.6
AA Large
4.1
AA Large
5.6
AA
2.6
Fail
—
1.4
Fail
1.6
Fail
7.7
AAA
3.6
AA Large
1.4
Fail
—
1.1
Fail
8.8
AAA
4.1
AA Large
1.6
Fail
1.1
Fail
—
White BG
11.5AAA
5.4AA
2.1Fail
1.5Fail
1.3Fail
Black BG
1.8Fail
3.9AA Large
10.2AAA
14.1AAA
16.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

393947
636479
A1A2BC
BBBBD8
D4D4E0

Deuteranopia

393946
636278
9E9ABC
B7B2D9
D2CFE1

Tritanopia

3A4342
5E7675
8EBCBC
A1DADB
C6E2E3

Achromatopsia

3A3A3A
696969
AEAEAE
CBCBCB
DDDDDD

Shades & Tints Shades & Tints

#3A374C

Dark
Light

#5D6C7D

Dark
Light

#8BBEBB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3a374c;
  --color-2: #5d6c7d;
  --color-3: #8bbebb;
  --color-4: #9ee0d6;
  --color-5: #c4e9dd;
}

SCSS

$color-1: #3a374c;
$color-2: #5d6c7d;
$color-3: #8bbebb;
$color-4: #9ee0d6;
$color-5: #c4e9dd;

TAILWIND

colors: {
  'brand-1': '#3a374c',
  'brand-2': '#5d6c7d',
  'brand-3': '#8bbebb',
  'brand-4': '#9ee0d6',
  'brand-5': '#c4e9dd',
}

RGB Array

[58, 55, 76], [93, 108, 125], [139, 190, 187], [158, 224, 214], [196, 233, 221]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #3A374C, #5D6C7D, #8BBEBB, #9EE0D6, #C4E9DD 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: #3a374c; --color-2: #5d6c7d; --color-3: #8bbebb; --color-4: #9ee0d6; --color-5: #c4e9dd. 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