← Back to Editor

#528C80 · #D9244F · #F44F55 · #FAB8A0 · #FFE5CF

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

#528C80

Mineral Blue · SlateGray · Mint Ice

HEX
#528C80
RGB
rgb(82, 140, 128)
HSL
hsl(168, 26%, 44%)
HSB
hsb(168, 41%, 55%)
CMYK
cmyk(41%, 0%, 9%, 45%)
Oklch
oklch(59.7% 0.064 179.2)

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

#D9244F

Vermilion · Crimson · Passion Red

HEX
#D9244F
RGB
rgb(217, 36, 79)
HSL
hsl(346, 72%, 50%)
HSB
hsb(346, 83%, 85%)
CMYK
cmyk(0%, 83%, 64%, 15%)
Oklch
oklch(57.6% 0.212 15.1)

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

#F44F55

Peach Pink · Tomato · Coral Red

HEX
#F44F55
RGB
rgb(244, 79, 85)
HSL
hsl(358, 88%, 63%)
HSB
hsb(358, 68%, 96%)
CMYK
cmyk(0%, 68%, 65%, 4%)
Oklch
oklch(65.8% 0.201 22.6)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#FAB8A0

Apricot · LightPink · Peach Orange

HEX
#FAB8A0
RGB
rgb(250, 184, 160)
HSL
hsl(16, 90%, 80%)
HSB
hsb(16, 36%, 98%)
CMYK
cmyk(0%, 26%, 36%, 2%)
Oklch
oklch(83.8% 0.084 40.8)

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

#FFE5CF

Apricot · Bisque · Peach Orange

HEX
#FFE5CF
RGB
rgb(255, 229, 207)
HSL
hsl(28, 100%, 91%)
HSB
hsb(28, 19%, 100%)
CMYK
cmyk(0%, 10%, 19%, 0%)
Oklch
oklch(93.7% 0.041 62.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

528C80
8D535F

Analogous

538D65
528C80
537C8D

Triadic

528C80
82538D
8D8253

Split-Comp.

528C80
8D537C
8D6553

Tetradic

528C80
65538D
8D535F
7C8D53

Contrast Matrix WCAG 2.1 Contrast

528C80
D9244F
F44F55
FAB8A0
FFE5CF
—
1.3
Fail
1.1
Fail
2.3
Fail
3.2
AA Large
1.3
Fail
—
1.4
Fail
2.9
Fail
4.0
AA Large
1.1
Fail
1.4
Fail
—
2.0
Fail
2.8
Fail
2.3
Fail
2.9
Fail
2.0
Fail
—
1.4
Fail
3.2
AA Large
4.0
AA Large
2.8
Fail
1.4
Fail
—
White BG
3.9AA Large
4.9AA
3.4AA Large
1.7Fail
1.2Fail
Black BG
5.4AA
4.3AA Large
6.1AA
12.4AAA
17.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6B6C83
8B8945
ADAB54
DDDDA6
F4F4D4

Deuteranopia

686384
95A342
B6C253
E1E6A7
F5F7D6

Tritanopia

558586
D03C3B
EC5252
F7AAAB
FED9D9

Achromatopsia

797979
5F5F5F
818181
C9C9C9
EAEAEA

Shades & Tints Shades & Tints

#528C80

Dark
Light

#D9244F

Dark
Light

#F44F55

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #528c80;
  --color-2: #d9244f;
  --color-3: #f44f55;
  --color-4: #fab8a0;
  --color-5: #ffe5cf;
}

SCSS

$color-1: #528c80;
$color-2: #d9244f;
$color-3: #f44f55;
$color-4: #fab8a0;
$color-5: #ffe5cf;

TAILWIND

colors: {
  'brand-1': '#528c80',
  'brand-2': '#d9244f',
  'brand-3': '#f44f55',
  'brand-4': '#fab8a0',
  'brand-5': '#ffe5cf',
}

RGB Array

[82, 140, 128], [217, 36, 79], [244, 79, 85], [250, 184, 160], [255, 229, 207]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #528C80, #D9244F, #F44F55, #FAB8A0, #FFE5CF is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs, 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: #528c80; --color-2: #d9244f; --color-3: #f44f55; --color-4: #fab8a0; --color-5: #ffe5cf. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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