← Back to Editor

#480018 · #A8D8F0 · #7890C0 · #183060 · #A02866

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

#480018

Dark Violet · Maroon · Raspberry

HEX
#480018
RGB
rgb(72, 0, 24)
HSL
hsl(340, 100%, 14%)
HSB
hsb(340, 100%, 28%)
CMYK
cmyk(0%, 100%, 67%, 72%)
Oklch
oklch(25.7% 0.103 9.6)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

#A8D8F0

Sky Blue · LightBlue · Cobalt Blue

HEX
#A8D8F0
RGB
rgb(168, 216, 240)
HSL
hsl(200, 71%, 80%)
HSB
hsb(200, 30%, 94%)
CMYK
cmyk(30%, 10%, 0%, 6%)
Oklch
oklch(85.7% 0.060 229.9)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

#7890C0

Azure · LightSlateGray · Cobalt Blue

HEX
#7890C0
RGB
rgb(120, 144, 192)
HSL
hsl(220, 36%, 61%)
HSB
hsb(220, 38%, 75%)
CMYK
cmyk(38%, 25%, 0%, 25%)
Oklch
oklch(65.3% 0.077 263.8)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#183060

Indigo · MidnightBlue · Prussian Blue

HEX
#183060
RGB
rgb(24, 48, 96)
HSL
hsl(220, 60%, 24%)
HSB
hsb(220, 75%, 38%)
CMYK
cmyk(75%, 50%, 0%, 62%)
Oklch
oklch(31.9% 0.091 262.5)

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

#A02866

Rose Purple · MediumVioletRed · Camellia

HEX
#A02866
RGB
rgb(160, 40, 102)
HSL
hsl(329, 60%, 39%)
HSB
hsb(329, 75%, 63%)
CMYK
cmyk(0%, 75%, 36%, 37%)
Oklch
oklch(48.5% 0.165 353.6)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

480018
004730

Analogous

47003B
480018
470C00

Triadic

480018
184700
001847

Split-Comp.

480018
00470C
003C47

Tetradic

480018
3C4700
004730
0C0047

Contrast Matrix WCAG 2.1 Contrast

480018
A8D8F0
7890C0
183060
A02866
—
10.7
AAA
5.1
AA
1.3
Fail
2.3
Fail
10.7
AAA
—
2.1
Fail
8.4
AAA
4.6
AA
5.1
AA
2.1
Fail
—
4.0
AA Large
2.2
Fail
1.3
Fail
8.4
AAA
4.0
AA Large
—
1.8
Fail
2.3
Fail
4.6
AA
2.2
Fail
1.8
Fail
—
White BG
16.3AAA
1.5Fail
3.2AA Large
12.9AAA
7.0AAA
Black BG
1.3Fail
13.7AAA
6.5AA
1.6Fail
3.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

292812
BDBDEA
8283B4
222354
6C6B57

Deuteranopia

2D3211
BAB6E9
817FB2
211F52
737C53

Tritanopia

440E0D
AAE6E5
79ABA9
194B49
9A4B49

Achromatopsia

181818
CCCCCC
8E8E8E
2E2E2E
535353

Shades & Tints Shades & Tints

#480018

Dark
Light

#A8D8F0

Dark
Light

#7890C0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #480018;
  --color-2: #a8d8f0;
  --color-3: #7890c0;
  --color-4: #183060;
  --color-5: #a02866;
}

SCSS

$color-1: #480018;
$color-2: #a8d8f0;
$color-3: #7890c0;
$color-4: #183060;
$color-5: #a02866;

TAILWIND

colors: {
  'brand-1': '#480018',
  'brand-2': '#a8d8f0',
  'brand-3': '#7890c0',
  'brand-4': '#183060',
  'brand-5': '#a02866',
}

RGB Array

[72, 0, 24], [168, 216, 240], [120, 144, 192], [24, 48, 96], [160, 40, 102]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #480018, #A8D8F0, #7890C0, #183060, #A02866 is ideal for: social media posters, mobile apps, e-commerce promos, 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: #480018; --color-2: #a8d8f0; --color-3: #7890c0; --color-4: #183060; --color-5: #a02866. 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 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