← Back to Editor

#141F6E · #1F2531 · #134199 · #0660AE · #D4D4D2

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

#141F6E

Indigo · MidnightBlue · Prussian Blue

HEX
#141F6E
RGB
rgb(20, 31, 110)
HSL
hsl(233, 69%, 25%)
HSB
hsb(233, 82%, 43%)
CMYK
cmyk(82%, 72%, 0%, 57%)
Oklch
oklch(29.3% 0.135 269.3)

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

#1F2531

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#1F2531
RGB
rgb(31, 37, 49)
HSL
hsl(220, 23%, 16%)
HSB
hsb(220, 37%, 19%)
CMYK
cmyk(37%, 24%, 0%, 81%)
Oklch
oklch(26.4% 0.024 264.0)

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

#134199

Indigo · DarkSlateBlue · Prussian Blue

HEX
#134199
RGB
rgb(19, 65, 153)
HSL
hsl(219, 78%, 34%)
HSB
hsb(219, 88%, 60%)
CMYK
cmyk(88%, 58%, 0%, 40%)
Oklch
oklch(40.3% 0.153 261.7)

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

#0660AE

Lake Blue · Teal · Prussian Blue

HEX
#0660AE
RGB
rgb(6, 96, 174)
HSL
hsl(208, 93%, 35%)
HSB
hsb(208, 97%, 68%)
CMYK
cmyk(97%, 45%, 0%, 32%)
Oklch
oklch(48.7% 0.145 252.4)

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

#D4D4D2

Silver Gray · LightGray · Pearl Gray

HEX
#D4D4D2
RGB
rgb(212, 212, 210)
HSL
hsl(60, 2%, 83%)
HSB
hsb(60, 1%, 83%)
CMYK
cmyk(0%, 0%, 1%, 17%)
Oklch
oklch(86.9% 0.003 106.5)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

141F6E
6C6114

Analogous

144A6C
141F6E
35146C

Triadic

141F6E
6C141E
1E6C14

Split-Comp.

141F6E
6C3514
4A6C14

Tetradic

141F6E
6C144A
6C6114
146C35

Contrast Matrix WCAG 2.1 Contrast

141F6E
1F2531
134199
0660AE
D4D4D2
—
1.1
Fail
1.5
Fail
2.3
Fail
9.8
AAA
1.1
Fail
—
1.6
Fail
2.4
Fail
10.3
AAA
1.5
Fail
1.6
Fail
—
1.5
Fail
6.3
AA
2.3
Fail
2.4
Fail
1.5
Fail
—
4.3
AA Large
9.8
AAA
10.3
AAA
6.3
AA
4.3
AA Large
—
White BG
14.5AAA
15.4AAA
9.4AAA
6.4AA
1.5Fail
Black BG
1.5Fail
1.4Fail
2.2Fail
3.3AA Large
14.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

19195B
22222E
272784
2D2E9B
D4D4D2

Deuteranopia

181756
21212D
24217F
282197
D4D4D3

Tritanopia

154C48
1F2C2B
15736F
0B8C89
D4D3D3

Achromatopsia

252525
252525
3D3D3D
4E4E4E
D4D4D4

Shades & Tints Shades & Tints

#141F6E

Dark
Light

#1F2531

Dark
Light

#134199

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #141f6e;
  --color-2: #1f2531;
  --color-3: #134199;
  --color-4: #0660ae;
  --color-5: #d4d4d2;
}

SCSS

$color-1: #141f6e;
$color-2: #1f2531;
$color-3: #134199;
$color-4: #0660ae;
$color-5: #d4d4d2;

TAILWIND

colors: {
  'brand-1': '#141f6e',
  'brand-2': '#1f2531',
  'brand-3': '#134199',
  'brand-4': '#0660ae',
  'brand-5': '#d4d4d2',
}

RGB Array

[20, 31, 110], [31, 37, 49], [19, 65, 153], [6, 96, 174], [212, 212, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #141F6E, #1F2531, #134199, #0660AE, #D4D4D2 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: #141f6e; --color-2: #1f2531; --color-3: #134199; --color-4: #0660ae; --color-5: #d4d4d2. 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