← Back to Editor

#E9E5E2 · #E0CCD5 · #5E7DAB · #505E6F · #424244

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

#E9E5E2

Apricot · Linen · Peach Orange

HEX
#E9E5E2
RGB
rgb(233, 229, 226)
HSL
hsl(26, 14%, 90%)
HSB
hsb(26, 3%, 91%)
CMYK
cmyk(0%, 2%, 3%, 9%)
Oklch
oklch(92.4% 0.006 59.6)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E0CCD5

Rouge · LightGray · Cherry Blossom

HEX
#E0CCD5
RGB
rgb(224, 204, 213)
HSL
hsl(333, 24%, 84%)
HSB
hsb(333, 9%, 88%)
CMYK
cmyk(0%, 9%, 5%, 12%)
Oklch
oklch(86.4% 0.025 348.6)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#5E7DAB

Azure · SteelBlue · Navy Blue

HEX
#5E7DAB
RGB
rgb(94, 125, 171)
HSL
hsl(216, 31%, 52%)
HSB
hsb(216, 45%, 67%)
CMYK
cmyk(45%, 27%, 0%, 33%)
Oklch
oklch(58.5% 0.080 258.1)

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

#505E6F

Indigo · DimGray · Prussian Blue

HEX
#505E6F
RGB
rgb(80, 94, 111)
HSL
hsl(213, 16%, 37%)
HSB
hsb(213, 28%, 44%)
CMYK
cmyk(28%, 15%, 0%, 56%)
Oklch
oklch(47.7% 0.033 253.4)

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

#424244

Dark Cyan · DarkSlateGray · Charcoal

HEX
#424244
RGB
rgb(66, 66, 68)
HSL
hsl(240, 1%, 26%)
HSB
hsb(240, 3%, 27%)
CMYK
cmyk(3%, 3%, 0%, 73%)
Oklch
oklch(38.0% 0.003 286.2)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E9E5E2
E2E6E9

Analogous

E9E2E2
E9E5E2
E9E9E2

Triadic

E9E5E2
E2E9E5
E5E2E9

Split-Comp.

E9E5E2
E2E9E9
E2E2E9

Tetradic

E9E5E2
E2E9E2
E2E6E9
E9E2E9

Contrast Matrix WCAG 2.1 Contrast

E9E5E2
E0CCD5
5E7DAB
505E6F
424244
—
1.2
Fail
3.4
AA Large
5.3
AA
8.0
AAA
1.2
Fail
—
2.8
Fail
4.3
AA Large
6.6
AA
3.4
AA Large
2.8
Fail
—
1.6
Fail
2.4
Fail
5.3
AA
4.3
AA Large
1.6
Fail
—
1.5
Fail
8.0
AAA
6.6
AA
2.4
Fail
1.5
Fail
—
White BG
1.3Fail
1.5Fail
4.2AA Large
6.6AA
10.0AAA
Black BG
16.8AAA
13.8AAA
5.0AA
3.2AA Large
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E7E7E3
D7D7D3
6B6CA0
56566B
424244

Deuteranopia

E8E8E3
D9DAD2
6A679D
55546A
424243

Tritanopia

E9E3E3
DFD1D1
609795
516867
424343

Achromatopsia

E6E6E6
D3D3D3
797979
5C5C5C
424242

Shades & Tints Shades & Tints

#E9E5E2

Dark
Light

#E0CCD5

Dark
Light

#5E7DAB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e9e5e2;
  --color-2: #e0ccd5;
  --color-3: #5e7dab;
  --color-4: #505e6f;
  --color-5: #424244;
}

SCSS

$color-1: #e9e5e2;
$color-2: #e0ccd5;
$color-3: #5e7dab;
$color-4: #505e6f;
$color-5: #424244;

TAILWIND

colors: {
  'brand-1': '#e9e5e2',
  'brand-2': '#e0ccd5',
  'brand-3': '#5e7dab',
  'brand-4': '#505e6f',
  'brand-5': '#424244',
}

RGB Array

[233, 229, 226], [224, 204, 213], [94, 125, 171], [80, 94, 111], [66, 66, 68]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #E9E5E2, #E0CCD5, #5E7DAB, #505E6F, #424244 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e9e5e2; --color-2: #e0ccd5; --color-3: #5e7dab; --color-4: #505e6f; --color-5: #424244. 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. Restrained colors convey professionalism and trust. 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