← Back to Editor

#F6F1F5 · #1C101C · #76AED3 · #5C4360 · #F2CF8F

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

#F6F1F5

Mauve · SeaShell · Lavender

HEX
#F6F1F5
RGB
rgb(246, 241, 245)
HSL
hsl(312, 22%, 95%)
HSB
hsb(312, 2%, 96%)
CMYK
cmyk(0%, 2%, 0%, 4%)
Oklch
oklch(96.3% 0.007 332.1)

Traditional「Mauve」· Paint「Lavender」· Creative Rose Petal

#1C101C

Rose Purple · Black · Dark Purple

HEX
#1C101C
RGB
rgb(28, 16, 28)
HSL
hsl(300, 27%, 9%)
HSB
hsb(300, 43%, 11%)
CMYK
cmyk(0%, 43%, 0%, 89%)
Oklch
oklch(19.5% 0.030 326.6)

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

#76AED3

Sky Blue · CornflowerBlue · Cobalt Blue

HEX
#76AED3
RGB
rgb(118, 174, 211)
HSL
hsl(204, 51%, 65%)
HSB
hsb(204, 44%, 83%)
CMYK
cmyk(44%, 18%, 0%, 17%)
Oklch
oklch(72.6% 0.080 238.3)

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

#5C4360

Dark Plum · DimGray · Eggplant

HEX
#5C4360
RGB
rgb(92, 67, 96)
HSL
hsl(292, 18%, 32%)
HSB
hsb(292, 30%, 38%)
CMYK
cmyk(4%, 30%, 0%, 62%)
Oklch
oklch(42.1% 0.057 321.8)

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

#F2CF8F

Goose Yellow · Khaki · Warm Sun

HEX
#F2CF8F
RGB
rgb(242, 207, 143)
HSL
hsl(39, 79%, 75%)
HSB
hsb(39, 41%, 95%)
CMYK
cmyk(0%, 14%, 41%, 5%)
Oklch
oklch(87.0% 0.090 82.1)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6F1F5
EFF5F1

Analogous

F3EFF5
F6F1F5
F5EFF1

Triadic

F6F1F5
F4F5EF
EFF4F5

Split-Comp.

F6F1F5
F1F5EF
EFF5F3

Tetradic

F6F1F5
F5F3EF
EFF5F1
EFF1F5

Contrast Matrix WCAG 2.1 Contrast

F6F1F5
1C101C
76AED3
5C4360
F2CF8F
—
16.5
AAA
2.1
Fail
7.8
AAA
1.3
Fail
16.5
AAA
—
7.7
AAA
2.1
Fail
12.4
AAA
2.1
Fail
7.7
AAA
—
3.6
AA Large
1.6
Fail
7.8
AAA
2.1
Fail
3.6
AA Large
—
5.8
AA
1.3
Fail
12.4
AAA
1.6
Fail
5.8
AA
—
White BG
1.1Fail
18.4AAA
2.4Fail
8.7AAA
1.5Fail
Black BG
18.8AAA
1.1Fail
8.8AAA
2.4Fail
14.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F4F4F4
171719
8E8FCA
515159
E3E39E

Deuteranopia

F4F5F4
181818
8B87C8
535457
E5E7A2

Tritanopia

F6F3F3
1B1716
79C3C1
5B5352
F0ABAD

Achromatopsia

F3F3F3
151515
A1A1A1
4E4E4E
D2D2D2

Shades & Tints Shades & Tints

#F6F1F5

Dark
Light

#1C101C

Dark
Light

#76AED3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6f1f5;
  --color-2: #1c101c;
  --color-3: #76aed3;
  --color-4: #5c4360;
  --color-5: #f2cf8f;
}

SCSS

$color-1: #f6f1f5;
$color-2: #1c101c;
$color-3: #76aed3;
$color-4: #5c4360;
$color-5: #f2cf8f;

TAILWIND

colors: {
  'brand-1': '#f6f1f5',
  'brand-2': '#1c101c',
  'brand-3': '#76aed3',
  'brand-4': '#5c4360',
  'brand-5': '#f2cf8f',
}

RGB Array

[246, 241, 245], [28, 16, 28], [118, 174, 211], [92, 67, 96], [242, 207, 143]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #F6F1F5, #1C101C, #76AED3, #5C4360, #F2CF8F 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: #f6f1f5; --color-2: #1c101c; --color-3: #76aed3; --color-4: #5c4360; --color-5: #f2cf8f. 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