← Back to Editor

#CAF0C8 · #56ECBE · #FB319E · #9A195A · #605E83

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

#CAF0C8

Emerald · LightGray · Mint Green

HEX
#CAF0C8
RGB
rgb(202, 240, 200)
HSL
hsl(117, 57%, 86%)
HSB
hsb(117, 17%, 94%)
CMYK
cmyk(16%, 0%, 17%, 6%)
Oklch
oklch(91.7% 0.067 143.7)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

#56ECBE

Jade · Turquoise · Lake Green

HEX
#56ECBE
RGB
rgb(86, 236, 190)
HSL
hsl(162, 80%, 63%)
HSB
hsb(162, 64%, 93%)
CMYK
cmyk(64%, 0%, 19%, 7%)
Oklch
oklch(85.1% 0.143 169.0)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#FB319E

Rose Purple · DeepPink · Rose Pink

HEX
#FB319E
RGB
rgb(251, 49, 158)
HSL
hsl(328, 96%, 59%)
HSB
hsb(328, 80%, 98%)
CMYK
cmyk(0%, 80%, 37%, 2%)
Oklch
oklch(66.4% 0.247 353.9)

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

#9A195A

Dark Violet · Brown · Camellia

HEX
#9A195A
RGB
rgb(154, 25, 90)
HSL
hsl(330, 72%, 35%)
HSB
hsb(330, 84%, 60%)
CMYK
cmyk(0%, 84%, 42%, 40%)
Oklch
oklch(45.9% 0.170 356.4)

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

#605E83

Deep Indigo · DimGray · Navy Blue

HEX
#605E83
RGB
rgb(96, 94, 131)
HSL
hsl(243, 16%, 44%)
HSB
hsb(243, 28%, 51%)
CMYK
cmyk(27%, 28%, 0%, 49%)
Oklch
oklch(49.9% 0.059 286.5)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CAF0C8
EEC7F0

Analogous

DDF0C7
CAF0C8
C7F0D9

Triadic

CAF0C8
C7C9F0
F0C7C9

Split-Comp.

CAF0C8
D9C7F0
F0C7DD

Tetradic

CAF0C8
C7DDF0
EEC7F0
F0D9C7

Contrast Matrix WCAG 2.1 Contrast

CAF0C8
56ECBE
FB319E
9A195A
605E83
—
1.2
Fail
2.8
Fail
6.3
AA
4.9
AA
1.2
Fail
—
2.3
Fail
5.3
AA
4.1
AA Large
2.8
Fail
2.3
Fail
—
2.3
Fail
1.8
Fail
6.3
AA
5.3
AA
2.3
Fail
—
1.3
Fail
4.9
AA
4.1
AA Large
1.8
Fail
1.3
Fail
—
White BG
1.2Fail
1.5Fail
3.5AA Large
7.9AAA
6.1AA
Black BG
16.8AAA
14.1AAA
6.0AA
2.7Fail
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DADBD2
9798C9
A4A284
62614A
5F5F7A

Deuteranopia

D8D5D4
8E83CC
AFBE7D
6A7347
5F5F78

Tritanopia

CCD9DB
5ED2D4
F16F6A
943E3B
607371

Achromatopsia

E0E0E0
BABABA
7A7A7A
474747
636363

Shades & Tints Shades & Tints

#CAF0C8

Dark
Light

#56ECBE

Dark
Light

#FB319E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #caf0c8;
  --color-2: #56ecbe;
  --color-3: #fb319e;
  --color-4: #9a195a;
  --color-5: #605e83;
}

SCSS

$color-1: #caf0c8;
$color-2: #56ecbe;
$color-3: #fb319e;
$color-4: #9a195a;
$color-5: #605e83;

TAILWIND

colors: {
  'brand-1': '#caf0c8',
  'brand-2': '#56ecbe',
  'brand-3': '#fb319e',
  'brand-4': '#9a195a',
  'brand-5': '#605e83',
}

RGB Array

[202, 240, 200], [86, 236, 190], [251, 49, 158], [154, 25, 90], [96, 94, 131]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #CAF0C8, #56ECBE, #FB319E, #9A195A, #605E83 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: #caf0c8; --color-2: #56ecbe; --color-3: #fb319e; --color-4: #9a195a; --color-5: #605e83. 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