← Back to Editor

#C5F7F7 · #E9FCF6 · #7CB0B5 · #4B160B · #D05318

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

#C5F7F7

Sky Blue · Lavender · Glacier Blue

HEX
#C5F7F7
RGB
rgb(197, 247, 247)
HSL
hsl(180, 76%, 87%)
HSB
hsb(180, 20%, 97%)
CMYK
cmyk(20%, 0%, 0%, 3%)
Oklch
oklch(94.2% 0.051 196.3)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#E9FCF6

Jade · Snow · Glacier Blue

HEX
#E9FCF6
RGB
rgb(233, 252, 246)
HSL
hsl(161, 76%, 95%)
HSB
hsb(161, 8%, 99%)
CMYK
cmyk(8%, 0%, 2%, 1%)
Oklch
oklch(97.5% 0.021 175.0)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#7CB0B5

Slate Blue · MediumAquaMarine · Lake Green

HEX
#7CB0B5
RGB
rgb(124, 176, 181)
HSL
hsl(185, 28%, 60%)
HSB
hsb(185, 31%, 71%)
CMYK
cmyk(31%, 3%, 0%, 29%)
Oklch
oklch(72.3% 0.055 203.5)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

#4B160B

Vermilion · Maroon · Deep Berry

HEX
#4B160B
RGB
rgb(75, 22, 11)
HSL
hsl(10, 74%, 17%)
HSB
hsb(10, 85%, 29%)
CMYK
cmyk(0%, 71%, 85%, 71%)
Oklch
oklch(28.5% 0.083 33.5)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#D05318

Tangerine · Chocolate · Amber Brown

HEX
#D05318
RGB
rgb(208, 83, 24)
HSL
hsl(19, 79%, 45%)
HSB
hsb(19, 88%, 82%)
CMYK
cmyk(0%, 60%, 88%, 18%)
Oklch
oklch(59.9% 0.171 41.5)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C5F7F7
F7C5C5

Analogous

C5F7DE
C5F7F7
C5DEF7

Triadic

C5F7F7
F7C5F7
F7F7C5

Split-Comp.

C5F7F7
F7C5DE
F7DEC5

Tetradic

C5F7F7
DEC5F7
F7C5C5
DEF7C5

Contrast Matrix WCAG 2.1 Contrast

C5F7F7
E9FCF6
7CB0B5
4B160B
D05318
—
1.1
Fail
2.1
Fail
12.7
AAA
3.7
AA Large
1.1
Fail
—
2.3
Fail
13.9
AAA
4.0
AA Large
2.1
Fail
2.3
Fail
—
6.2
AA
1.8
Fail
12.7
AAA
13.9
AAA
6.2
AA
—
3.5
AA Large
3.7
AA Large
4.0
AA Large
1.8
Fail
3.5
AA Large
—
White BG
1.2Fail
1.1Fail
2.4Fail
14.8AAA
4.3AA Large
Black BG
18.0AAA
19.7AAA
8.7AAA
1.4Fail
4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDBF7
F1F1F7
9393B4
34340E
9A9926

Deuteranopia

D8D4F7
F0EFF8
908CB4
373B0E
A1AB2A

Tritanopia

C7F7F7
EAF9F9
7FB3B3
481010
CA3234

Achromatopsia

E8E8E8
F6F6F6
A1A1A1
252525
727272

Shades & Tints Shades & Tints

#C5F7F7

Dark
Light

#E9FCF6

Dark
Light

#7CB0B5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c5f7f7;
  --color-2: #e9fcf6;
  --color-3: #7cb0b5;
  --color-4: #4b160b;
  --color-5: #d05318;
}

SCSS

$color-1: #c5f7f7;
$color-2: #e9fcf6;
$color-3: #7cb0b5;
$color-4: #4b160b;
$color-5: #d05318;

TAILWIND

colors: {
  'brand-1': '#c5f7f7',
  'brand-2': '#e9fcf6',
  'brand-3': '#7cb0b5',
  'brand-4': '#4b160b',
  'brand-5': '#d05318',
}

RGB Array

[197, 247, 247], [233, 252, 246], [124, 176, 181], [75, 22, 11], [208, 83, 24]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #C5F7F7, #E9FCF6, #7CB0B5, #4B160B, #D05318 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: #c5f7f7; --color-2: #e9fcf6; --color-3: #7cb0b5; --color-4: #4b160b; --color-5: #d05318. 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