← Back to Editor

#9DA5AB · #70899D · #28202F · #61273F · #A52443

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#9DA5AB

Sky Blue · DarkGray · Silver Sand

HEX
#9DA5AB
RGB
rgb(157, 165, 171)
HSL
hsl(206, 8%, 64%)
HSB
hsb(206, 8%, 67%)
CMYK
cmyk(8%, 4%, 0%, 33%)
Oklch
oklch(71.7% 0.013 240.0)

Traditional「Sky Blue」· Paint「Silver Sand」· Creative Urban Concrete

#70899D

Slate Blue · LightSlateGray · Navy Blue

HEX
#70899D
RGB
rgb(112, 137, 157)
HSL
hsl(207, 19%, 53%)
HSB
hsb(207, 29%, 62%)
CMYK
cmyk(29%, 13%, 0%, 38%)
Oklch
oklch(61.8% 0.042 242.5)

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

#28202F

Dark Plum · DarkSlateGray · Dark Purple

HEX
#28202F
RGB
rgb(40, 32, 47)
HSL
hsl(272, 19%, 15%)
HSB
hsb(272, 32%, 18%)
CMYK
cmyk(15%, 32%, 0%, 82%)
Oklch
oklch(26.0% 0.030 308.6)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#61273F

Dark Violet · DarkSlateGray · Camellia

HEX
#61273F
RGB
rgb(97, 39, 63)
HSL
hsl(335, 43%, 27%)
HSB
hsb(335, 60%, 38%)
CMYK
cmyk(0%, 60%, 35%, 62%)
Oklch
oklch(36.3% 0.089 356.5)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#A52443

Vermilion · Brown · Wine Red

HEX
#A52443
RGB
rgb(165, 36, 67)
HSL
hsl(346, 64%, 39%)
HSB
hsb(346, 78%, 65%)
CMYK
cmyk(0%, 78%, 59%, 35%)
Oklch
oklch(48.0% 0.164 12.7)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9DA5AB
ABA29C

Analogous

9CABAA
9DA5AB
9C9DAB

Triadic

9DA5AB
AB9CA4
A4AB9C

Split-Comp.

9DA5AB
AB9C9D
ABAA9C

Tetradic

9DA5AB
AA9CAB
ABA29C
9DAB9C

Contrast Matrix WCAG 2.1 Contrast

9DA5AB
70899D
28202F
61273F
A52443
—
1.5
Fail
6.3
AA
4.5
AA Large
2.9
Fail
1.5
Fail
—
4.3
AA Large
3.1
AA Large
2.0
Fail
6.3
AA
4.3
AA Large
—
1.4
Fail
2.2
Fail
4.5
AA Large
3.1
AA Large
1.4
Fail
—
1.6
Fail
2.9
Fail
2.0
Fail
2.2
Fail
1.6
Fail
—
White BG
2.5Fail
3.6AA Large
15.7AAA
11.2AAA
7.2AAA
Black BG
8.4AAA
5.8AA
1.3Fail
1.9Fail
2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A0A1AA
7B7B98
25242B
484739
6D6C3B

Deuteranopia

A09FA9
797897
25262B
4B5038
757E3A

Tritanopia

9DA8A8
719494
282928
5E3534
9F3634

Achromatopsia

A3A3A3
848484
242424
3B3B3B
4E4E4E

Shades & Tints Shades & Tints

#9DA5AB

Dark
Light

#70899D

Dark
Light

#28202F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9da5ab;
  --color-2: #70899d;
  --color-3: #28202f;
  --color-4: #61273f;
  --color-5: #a52443;
}

SCSS

$color-1: #9da5ab;
$color-2: #70899d;
$color-3: #28202f;
$color-4: #61273f;
$color-5: #a52443;

TAILWIND

colors: {
  'brand-1': '#9da5ab',
  'brand-2': '#70899d',
  'brand-3': '#28202f',
  'brand-4': '#61273f',
  'brand-5': '#a52443',
}

RGB Array

[157, 165, 171], [112, 137, 157], [40, 32, 47], [97, 39, 63], [165, 36, 67]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #9DA5AB, #70899D, #28202F, #61273F, #A52443 is ideal for: tech websites, dark mode UIs, game UIs, 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: #9da5ab; --color-2: #70899d; --color-3: #28202f; --color-4: #61273f; --color-5: #a52443. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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