← Back to Editor

#FBFBF3 · #758698 · #396884 · #1D2D47 · #0D0E23

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

#FBFBF3

Fresh Green · Snow · Lemon Cream

HEX
#FBFBF3
RGB
rgb(251, 251, 243)
HSL
hsl(60, 50%, 97%)
HSB
hsb(60, 3%, 98%)
CMYK
cmyk(0%, 0%, 3%, 2%)
Oklch
oklch(98.6% 0.011 106.6)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#758698

Azure · LightSlateGray · Navy Blue

HEX
#758698
RGB
rgb(117, 134, 152)
HSL
hsl(211, 15%, 53%)
HSB
hsb(211, 23%, 60%)
CMYK
cmyk(23%, 12%, 0%, 40%)
Oklch
oklch(61.3% 0.034 249.9)

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

#396884

Slate Blue · DarkSlateBlue · Prussian Blue

HEX
#396884
RGB
rgb(57, 104, 132)
HSL
hsl(202, 40%, 37%)
HSB
hsb(202, 57%, 52%)
CMYK
cmyk(57%, 21%, 0%, 48%)
Oklch
oklch(49.6% 0.068 236.5)

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

#1D2D47

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#1D2D47
RGB
rgb(29, 45, 71)
HSL
hsl(217, 42%, 20%)
HSB
hsb(217, 59%, 28%)
CMYK
cmyk(59%, 37%, 0%, 72%)
Oklch
oklch(29.7% 0.052 259.8)

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

#0D0E23

Indigo · Black · Deep Sea Blue

HEX
#0D0E23
RGB
rgb(13, 14, 35)
HSL
hsl(237, 46%, 9%)
HSB
hsb(237, 63%, 14%)
CMYK
cmyk(63%, 60%, 0%, 86%)
Oklch
oklch(17.6% 0.043 279.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FBFBF3
F4F4FB

Analogous

FBF7F4
FBFBF3
F7FBF4

Triadic

FBFBF3
F4FBFB
FBF4FB

Split-Comp.

FBFBF3
F4F7FB
F7F4FB

Tetradic

FBFBF3
F4FBF7
F4F4FB
FBF4F7

Contrast Matrix WCAG 2.1 Contrast

FBFBF3
758698
396884
1D2D47
0D0E23
—
3.6
AA Large
5.8
AA
13.3
AAA
18.3
AAA
3.6
AA Large
—
1.6
Fail
3.7
AA Large
5.1
AA
5.8
AA
1.6
Fail
—
2.3
Fail
3.2
AA Large
13.3
AAA
3.7
AA Large
2.3
Fail
—
1.4
Fail
18.3
AAA
5.1
AA
3.2
AA Large
1.4
Fail
—
White BG
1.0Fail
3.7AA Large
6.0AA
13.8AAA
19.0AAA
Black BG
20.2AAA
5.6AA
3.5AA Large
1.5Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FBFBF5
7C7D94
4D4E7D
242441
0D0D1E

Deuteranopia

FBFBF5
7B7A93
4B477C
23223F
0D0D1D

Tritanopia

FBF6F7
76908F
3B7877
1E3C3B
0D1A19

Achromatopsia

FAFAFA
838383
5D5D5D
2B2B2B
101010

Shades & Tints Shades & Tints

#FBFBF3

Dark
Light

#758698

Dark
Light

#396884

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fbfbf3;
  --color-2: #758698;
  --color-3: #396884;
  --color-4: #1d2d47;
  --color-5: #0d0e23;
}

SCSS

$color-1: #fbfbf3;
$color-2: #758698;
$color-3: #396884;
$color-4: #1d2d47;
$color-5: #0d0e23;

TAILWIND

colors: {
  'brand-1': '#fbfbf3',
  'brand-2': '#758698',
  'brand-3': '#396884',
  'brand-4': '#1d2d47',
  'brand-5': '#0d0e23',
}

RGB Array

[251, 251, 243], [117, 134, 152], [57, 104, 132], [29, 45, 71], [13, 14, 35]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #FBFBF3, #758698, #396884, #1D2D47, #0D0E23 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: #fbfbf3; --color-2: #758698; --color-3: #396884; --color-4: #1d2d47; --color-5: #0d0e23. 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