← Back to Editor

#0D1A3D · #096968 · #4F8466 · #D0AB81 · #BF321E

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

#0D1A3D

Indigo · MidnightBlue · Deep Sea Blue

HEX
#0D1A3D
RGB
rgb(13, 26, 61)
HSL
hsl(224, 65%, 15%)
HSB
hsb(224, 79%, 24%)
CMYK
cmyk(79%, 57%, 0%, 76%)
Oklch
oklch(23.0% 0.070 265.8)

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

#096968

Mineral Blue · Teal · Peacock Green

HEX
#096968
RGB
rgb(9, 105, 104)
HSL
hsl(179, 84%, 22%)
HSB
hsb(179, 91%, 41%)
CMYK
cmyk(91%, 0%, 1%, 59%)
Oklch
oklch(47.2% 0.079 193.6)

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

#4F8466

Celadon · SeaGreen · Olive Green

HEX
#4F8466
RGB
rgb(79, 132, 102)
HSL
hsl(146, 25%, 41%)
HSB
hsb(146, 40%, 52%)
CMYK
cmyk(40%, 0%, 23%, 48%)
Oklch
oklch(56.7% 0.074 158.1)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#D0AB81

Ginger · Tan · Warm Sun

HEX
#D0AB81
RGB
rgb(208, 171, 129)
HSL
hsl(32, 46%, 66%)
HSB
hsb(32, 38%, 82%)
CMYK
cmyk(0%, 18%, 38%, 18%)
Oklch
oklch(76.4% 0.071 70.0)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#BF321E

Vermilion · FireBrick · Passion Red

HEX
#BF321E
RGB
rgb(191, 50, 30)
HSL
hsl(7, 73%, 43%)
HSB
hsb(7, 84%, 75%)
CMYK
cmyk(0%, 74%, 84%, 25%)
Oklch
oklch(53.3% 0.181 31.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

0D1A3D
3F320D

Analogous

0D343F
0D1A3D
190D3F

Triadic

0D1A3D
3F0D1B
1B3F0D

Split-Comp.

0D1A3D
3F190D
343F0D

Tetradic

0D1A3D
3F0D34
3F320D
0D3F19

Contrast Matrix WCAG 2.1 Contrast

0D1A3D
096968
4F8466
D0AB81
BF321E
—
2.6
Fail
3.9
AA Large
8.0
AAA
3.0
Fail
2.6
Fail
—
1.5
Fail
3.0
AA Large
1.1
Fail
3.9
AA Large
1.5
Fail
—
2.0
Fail
1.3
Fail
8.0
AAA
3.0
AA Large
2.0
Fail
—
2.7
Fail
3.0
Fail
1.1
Fail
1.3
Fail
2.7
Fail
—
White BG
17.0AAA
6.5AA
4.4AA Large
2.1Fail
5.7AA
Black BG
1.2Fail
3.2AA Large
4.8AA
9.8AAA
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

131335
333368
66666D
C0C08B
828123

Deuteranopia

121132
2D2668
635F6F
C2C58E
8A9524

Tritanopia

0E2E2C
0E6868
527374
CE9395
B82728

Achromatopsia

1A1A1A
4C4C4C
717171
B1B1B1
5A5A5A

Shades & Tints Shades & Tints

#0D1A3D

Dark
Light

#096968

Dark
Light

#4F8466

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #0d1a3d;
  --color-2: #096968;
  --color-3: #4f8466;
  --color-4: #d0ab81;
  --color-5: #bf321e;
}

SCSS

$color-1: #0d1a3d;
$color-2: #096968;
$color-3: #4f8466;
$color-4: #d0ab81;
$color-5: #bf321e;

TAILWIND

colors: {
  'brand-1': '#0d1a3d',
  'brand-2': '#096968',
  'brand-3': '#4f8466',
  'brand-4': '#d0ab81',
  'brand-5': '#bf321e',
}

RGB Array

[13, 26, 61], [9, 105, 104], [79, 132, 102], [208, 171, 129], [191, 50, 30]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #0D1A3D, #096968, #4F8466, #D0AB81, #BF321E 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: #0d1a3d; --color-2: #096968; --color-3: #4f8466; --color-4: #d0ab81; --color-5: #bf321e. 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