← Back to Editor

#E3D8BC · #1793B5 · #0686AB · #027A9F · #002130

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#E3D8BC

Goose Yellow · Wheat · Lemon Cream

HEX
#E3D8BC
RGB
rgb(227, 216, 188)
HSL
hsl(43, 41%, 81%)
HSB
hsb(43, 17%, 89%)
CMYK
cmyk(0%, 5%, 17%, 11%)
Oklch
oklch(88.4% 0.039 89.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#1793B5

Lake Blue · LightSeaGreen · Mint Ice

HEX
#1793B5
RGB
rgb(23, 147, 181)
HSL
hsl(193, 77%, 40%)
HSB
hsb(193, 87%, 71%)
CMYK
cmyk(87%, 19%, 0%, 29%)
Oklch
oklch(61.7% 0.110 222.8)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#0686AB

Lake Blue · Teal · Mint Ice

HEX
#0686AB
RGB
rgb(6, 134, 171)
HSL
hsl(193, 93%, 35%)
HSB
hsb(193, 96%, 67%)
CMYK
cmyk(96%, 22%, 0%, 33%)
Oklch
oklch(57.8% 0.110 226.2)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#027A9F

Lake Blue · Teal · Mint Ice

HEX
#027A9F
RGB
rgb(2, 122, 159)
HSL
hsl(194, 98%, 32%)
HSB
hsb(194, 99%, 62%)
CMYK
cmyk(99%, 23%, 0%, 38%)
Oklch
oklch(54.1% 0.105 228.2)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#002130

Lake Blue · Black · Peacock Green

HEX
#002130
RGB
rgb(0, 33, 48)
HSL
hsl(199, 100%, 9%)
HSB
hsb(199, 100%, 19%)
CMYK
cmyk(100%, 31%, 0%, 81%)
Oklch
oklch(23.3% 0.048 232.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3D8BC
BBC6E2

Analogous

E2C3BB
E3D8BC
DAE2BB

Triadic

E3D8BC
BBE2D7
D7BBE2

Split-Comp.

E3D8BC
BBDAE2
C3BBE2

Tetradic

E3D8BC
BBE2C3
BBC6E2
E2BBDA

Contrast Matrix WCAG 2.1 Contrast

E3D8BC
1793B5
0686AB
027A9F
002130
—
2.5
Fail
3.0
Fail
3.5
AA Large
11.8
AAA
2.5
Fail
—
1.2
Fail
1.4
Fail
4.7
AA
3.0
Fail
1.2
Fail
—
1.2
Fail
4.0
AA Large
3.5
AA Large
1.4
Fail
1.2
Fail
—
3.4
AA Large
11.8
AAA
4.7
AA
4.0
AA Large
3.4
AA Large
—
White BG
1.4Fail
3.6AA Large
4.2AA Large
4.9AA
16.7AAA
Black BG
14.8AAA
5.9AA
5.0AA
4.3AA Large
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDEC3
4D4EAD
3D3FA2
363796
0E0F2C

Deuteranopia

DFE0C4
463CAB
362CA0
2F2694
0C0A2B

Tritanopia

E2C8C9
1DA6A5
0C9B99
088F8D
022A29

Achromatopsia

D8D8D8
727272
646464
5A5A5A
191919

Shades & Tints Shades & Tints

#E3D8BC

Dark
Light

#1793B5

Dark
Light

#0686AB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3d8bc;
  --color-2: #1793b5;
  --color-3: #0686ab;
  --color-4: #027a9f;
  --color-5: #002130;
}

SCSS

$color-1: #e3d8bc;
$color-2: #1793b5;
$color-3: #0686ab;
$color-4: #027a9f;
$color-5: #002130;

TAILWIND

colors: {
  'brand-1': '#e3d8bc',
  'brand-2': '#1793b5',
  'brand-3': '#0686ab',
  'brand-4': '#027a9f',
  'brand-5': '#002130',
}

RGB Array

[227, 216, 188], [23, 147, 181], [6, 134, 171], [2, 122, 159], [0, 33, 48]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #E3D8BC, #1793B5, #0686AB, #027A9F, #002130 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: #e3d8bc; --color-2: #1793b5; --color-3: #0686ab; --color-4: #027a9f; --color-5: #002130. 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