← Back to Editor

#3A2047 · #8D3A58 · #F55C57 · #FB2C1A · #9C010F

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#3A2047

Dark Plum · DarkSlateGray · Dark Purple

HEX
#3A2047
RGB
rgb(58, 32, 71)
HSL
hsl(280, 38%, 20%)
HSB
hsb(280, 55%, 28%)
CMYK
cmyk(18%, 55%, 0%, 72%)
Oklch
oklch(29.7% 0.075 313.4)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#8D3A58

Dark Violet · Sienna · Camellia

HEX
#8D3A58
RGB
rgb(141, 58, 88)
HSL
hsl(338, 42%, 39%)
HSB
hsb(338, 59%, 55%)
CMYK
cmyk(0%, 59%, 38%, 45%)
Oklch
oklch(47.0% 0.117 360.0)

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

#F55C57

Peach Pink · Tomato · Coral Red

HEX
#F55C57
RGB
rgb(245, 92, 87)
HSL
hsl(2, 89%, 65%)
HSB
hsb(2, 64%, 96%)
CMYK
cmyk(0%, 62%, 64%, 4%)
Oklch
oklch(67.5% 0.189 25.4)

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

#FB2C1A

Vermilion · OrangeRed · Passion Red

HEX
#FB2C1A
RGB
rgb(251, 44, 26)
HSL
hsl(5, 97%, 54%)
HSB
hsb(5, 90%, 98%)
CMYK
cmyk(0%, 82%, 90%, 2%)
Oklch
oklch(63.6% 0.240 30.0)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#9C010F

Vermilion · DarkRed · Wine Red

HEX
#9C010F
RGB
rgb(156, 1, 15)
HSL
hsl(355, 99%, 31%)
HSB
hsb(355, 99%, 61%)
CMYK
cmyk(0%, 99%, 90%, 39%)
Oklch
oklch(43.6% 0.177 26.8)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3A2047
2D4620

Analogous

262046
3A2047
462040

Triadic

3A2047
463920
204639

Split-Comp.

3A2047
404620
204626

Tetradic

3A2047
462620
2D4620
204046

Contrast Matrix WCAG 2.1 Contrast

3A2047
8D3A58
F55C57
FB2C1A
9C010F
—
1.9
Fail
4.4
AA Large
3.7
AA Large
1.6
Fail
1.9
Fail
—
2.3
Fail
1.9
Fail
1.2
Fail
4.4
AA Large
2.3
Fail
—
1.2
Fail
2.7
Fail
3.7
AA Large
1.9
Fail
1.2
Fail
—
2.3
Fail
1.6
Fail
1.2
Fail
2.7
Fail
2.3
Fail
—
White BG
14.2AAA
7.3AAA
3.2AA Large
3.8AA Large
8.7AAA
Black BG
1.5Fail
2.9Fail
6.6AA
5.5AA
2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

2F2F3E
696851
B3B158
A1A01E
59570C

Deuteranopia

30323B
6E744F
BCC759
ADBD1F
626D0B

Tritanopia

393634
894B4A
ED5959
F12223
940908

Achromatopsia

2C2C2C
565656
898989
686868
313131

Shades & Tints Shades & Tints

#3A2047

Dark
Light

#8D3A58

Dark
Light

#F55C57

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3a2047;
  --color-2: #8d3a58;
  --color-3: #f55c57;
  --color-4: #fb2c1a;
  --color-5: #9c010f;
}

SCSS

$color-1: #3a2047;
$color-2: #8d3a58;
$color-3: #f55c57;
$color-4: #fb2c1a;
$color-5: #9c010f;

TAILWIND

colors: {
  'brand-1': '#3a2047',
  'brand-2': '#8d3a58',
  'brand-3': '#f55c57',
  'brand-4': '#fb2c1a',
  'brand-5': '#9c010f',
}

RGB Array

[58, 32, 71], [141, 58, 88], [245, 92, 87], [251, 44, 26], [156, 1, 15]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #3A2047, #8D3A58, #F55C57, #FB2C1A, #9C010F 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: #3a2047; --color-2: #8d3a58; --color-3: #f55c57; --color-4: #fb2c1a; --color-5: #9c010f. 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