← Back to Editor

#363F42 · #448098 · #ADEA51 · #EAA194 · #E19BDA

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

#363F42

Slate Blue · DarkSlateGray · Peacock Green

HEX
#363F42
RGB
rgb(54, 63, 66)
HSL
hsl(195, 10%, 24%)
HSB
hsb(195, 18%, 26%)
CMYK
cmyk(18%, 5%, 0%, 74%)
Oklch
oklch(36.1% 0.013 219.8)

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

#448098

Slate Blue · SteelBlue · Mint Ice

HEX
#448098
RGB
rgb(68, 128, 152)
HSL
hsl(197, 38%, 43%)
HSB
hsb(197, 55%, 60%)
CMYK
cmyk(55%, 16%, 0%, 40%)
Oklch
oklch(56.9% 0.072 226.3)

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

#ADEA51

Willow Green · GreenYellow · Apple Green

HEX
#ADEA51
RGB
rgb(173, 234, 81)
HSL
hsl(84, 78%, 62%)
HSB
hsb(84, 65%, 92%)
CMYK
cmyk(26%, 0%, 65%, 8%)
Oklch
oklch(86.7% 0.191 128.5)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#EAA194

Peach Pink · DarkSalmon · Coral Red

HEX
#EAA194
RGB
rgb(234, 161, 148)
HSL
hsl(9, 67%, 75%)
HSB
hsb(9, 37%, 92%)
CMYK
cmyk(0%, 31%, 37%, 8%)
Oklch
oklch(77.7% 0.090 30.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#E19BDA

Mauve · Violet · Lilac Purple

HEX
#E19BDA
RGB
rgb(225, 155, 218)
HSL
hsl(306, 54%, 75%)
HSB
hsb(306, 31%, 88%)
CMYK
cmyk(0%, 31%, 3%, 12%)
Oklch
oklch(77.8% 0.117 330.1)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

363F42
433A37

Analogous

374340
363F42
373A43

Triadic

363F42
433740
404337

Split-Comp.

363F42
43373A
434037

Tetradic

363F42
403743
433A37
3A4337

Contrast Matrix WCAG 2.1 Contrast

363F42
448098
ADEA51
EAA194
E19BDA
—
2.5
Fail
7.5
AAA
5.1
AA
5.1
AA
2.5
Fail
—
3.1
AA Large
2.1
Fail
2.1
Fail
7.5
AAA
3.1
AA Large
—
1.5
Fail
1.5
Fail
5.1
AA
2.1
Fail
1.5
Fail
—
1.0
Fail
5.1
AA
2.1
Fail
1.5
Fail
1.0
Fail
—
White BG
10.8AAA
4.4AA Large
1.4Fail
2.1Fail
2.1Fail
Black BG
1.9Fail
4.8AA
14.7AAA
10.0AAA
9.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3A3A41
5E5F92
C7C876
CACA97
C3C2CB

Deuteranopia

393941
5B5691
C4BF7F
CFD498
C7CCC7

Tritanopia

364141
478E8D
B0939A
E69A9A
DEBFBC

Achromatopsia

3D3D3D
717171
C6C6C6
B5B5B5
B7B7B7

Shades & Tints Shades & Tints

#363F42

Dark
Light

#448098

Dark
Light

#ADEA51

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #363f42;
  --color-2: #448098;
  --color-3: #adea51;
  --color-4: #eaa194;
  --color-5: #e19bda;
}

SCSS

$color-1: #363f42;
$color-2: #448098;
$color-3: #adea51;
$color-4: #eaa194;
$color-5: #e19bda;

TAILWIND

colors: {
  'brand-1': '#363f42',
  'brand-2': '#448098',
  'brand-3': '#adea51',
  'brand-4': '#eaa194',
  'brand-5': '#e19bda',
}

RGB Array

[54, 63, 66], [68, 128, 152], [173, 234, 81], [234, 161, 148], [225, 155, 218]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #363F42, #448098, #ADEA51, #EAA194, #E19BDA 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: #363f42; --color-2: #448098; --color-3: #adea51; --color-4: #eaa194; --color-5: #e19bda. 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