← Back to Editor

#010A29 · #01203F · #0C4F6A · #61A0B1 · #BFD6E4

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#010A29

Indigo · Black · Deep Sea Blue

HEX
#010A29
RGB
rgb(1, 10, 41)
HSL
hsl(227, 95%, 8%)
HSB
hsb(227, 98%, 16%)
CMYK
cmyk(98%, 76%, 0%, 84%)
Oklch
oklch(16.0% 0.066 262.5)

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

#01203F

Indigo · MidnightBlue · Deep Sea Blue

HEX
#01203F
RGB
rgb(1, 32, 63)
HSL
hsl(210, 97%, 13%)
HSB
hsb(210, 98%, 25%)
CMYK
cmyk(98%, 49%, 0%, 75%)
Oklch
oklch(24.1% 0.069 251.6)

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

#0C4F6A

Lake Blue · DarkSlateGray · Peacock Green

HEX
#0C4F6A
RGB
rgb(12, 79, 106)
HSL
hsl(197, 80%, 23%)
HSB
hsb(197, 89%, 42%)
CMYK
cmyk(89%, 25%, 0%, 58%)
Oklch
oklch(40.2% 0.076 231.5)

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

#61A0B1

Slate Blue · CadetBlue · Lake Green

HEX
#61A0B1
RGB
rgb(97, 160, 177)
HSL
hsl(193, 34%, 54%)
HSB
hsb(193, 45%, 69%)
CMYK
cmyk(45%, 10%, 0%, 31%)
Oklch
oklch(67.0% 0.069 216.9)

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

#BFD6E4

Sky Blue · LightBlue · Sky Blue

HEX
#BFD6E4
RGB
rgb(191, 214, 228)
HSL
hsl(203, 41%, 82%)
HSB
hsb(203, 16%, 89%)
CMYK
cmyk(16%, 6%, 0%, 11%)
Oklch
oklch(86.3% 0.031 234.5)

Traditional「Sky Blue」· Paint「Sky Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

010A29
281F01

Analogous

011D28
010A29
0C0128

Triadic

010A29
280109
092801

Split-Comp.

010A29
280C01
1D2801

Tetradic

010A29
28011D
281F01
01280C

Contrast Matrix WCAG 2.1 Contrast

010A29
01203F
0C4F6A
61A0B1
BFD6E4
—
1.2
Fail
2.2
Fail
6.7
AA
13.0
AAA
1.2
Fail
—
1.8
Fail
5.6
AA
10.9
AAA
2.2
Fail
1.8
Fail
—
3.1
AA Large
6.0
AA
6.7
AA
5.6
AA
3.1
AA Large
—
1.9
Fail
13.0
AAA
10.9
AAA
6.0
AA
1.9
Fail
—
White BG
19.5AAA
16.4AAA
9.0AAA
2.9Fail
1.5Fail
Black BG
1.1Fail
1.3Fail
2.3Fail
7.2AAA
14.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

050521
0E0F37
292A63
7C7DAD
C9C9E1

Deuteranopia

040420
0D0A36
252062
7974AC
C8C6E0

Tritanopia

011C1A
033230
0F5E5D
64AAA9
C0DEDD

Achromatopsia

0B0B0B
1A1A1A
3E3E3E
8F8F8F
D1D1D1

Shades & Tints Shades & Tints

#010A29

Dark
Light

#01203F

Dark
Light

#0C4F6A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #010a29;
  --color-2: #01203f;
  --color-3: #0c4f6a;
  --color-4: #61a0b1;
  --color-5: #bfd6e4;
}

SCSS

$color-1: #010a29;
$color-2: #01203f;
$color-3: #0c4f6a;
$color-4: #61a0b1;
$color-5: #bfd6e4;

TAILWIND

colors: {
  'brand-1': '#010a29',
  'brand-2': '#01203f',
  'brand-3': '#0c4f6a',
  'brand-4': '#61a0b1',
  'brand-5': '#bfd6e4',
}

RGB Array

[1, 10, 41], [1, 32, 63], [12, 79, 106], [97, 160, 177], [191, 214, 228]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #010A29, #01203F, #0C4F6A, #61A0B1, #BFD6E4 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #010a29; --color-2: #01203f; --color-3: #0c4f6a; --color-4: #61a0b1; --color-5: #bfd6e4. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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