← Back to Editor

#807575 · #8285A1 · #C5E6D6 · #E3ECE2 · #EEE3E6

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#807575

Ink Gray · Gray · Warm Gray

HEX
#807575
RGB
rgb(128, 117, 117)
HSL
hsl(0, 4%, 48%)
HSB
hsb(0, 9%, 50%)
CMYK
cmyk(0%, 9%, 9%, 50%)
Oklch
oklch(57.2% 0.014 17.6)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#8285A1

Azure · LightSlateGray · Navy Blue

HEX
#8285A1
RGB
rgb(130, 133, 161)
HSL
hsl(234, 14%, 57%)
HSB
hsb(234, 19%, 63%)
CMYK
cmyk(19%, 17%, 0%, 37%)
Oklch
oklch(62.4% 0.042 280.3)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#C5E6D6

Jade · LightGray · Mint Green

HEX
#C5E6D6
RGB
rgb(197, 230, 214)
HSL
hsl(151, 40%, 84%)
HSB
hsb(151, 14%, 90%)
CMYK
cmyk(14%, 0%, 7%, 10%)
Oklch
oklch(89.7% 0.041 164.7)

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

#E3ECE2

Celadon · Beige · Mint Green

HEX
#E3ECE2
RGB
rgb(227, 236, 226)
HSL
hsl(114, 21%, 91%)
HSB
hsb(114, 4%, 93%)
CMYK
cmyk(4%, 0%, 4%, 7%)
Oklch
oklch(93.4% 0.016 142.6)

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

#EEE3E6

Rouge · Linen · Cherry Blossom

HEX
#EEE3E6
RGB
rgb(238, 227, 230)
HSL
hsl(344, 24%, 91%)
HSB
hsb(344, 5%, 93%)
CMYK
cmyk(0%, 5%, 3%, 7%)
Oklch
oklch(92.5% 0.013 358.8)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

807575
767F7F

Analogous

7F767A
807575
7F7A76

Triadic

807575
767F76
76767F

Split-Comp.

807575
767F7A
767A7F

Tetradic

807575
7A7F76
767F7F
7A767F

Contrast Matrix WCAG 2.1 Contrast

807575
8285A1
C5E6D6
E3ECE2
EEE3E6
—
1.2
Fail
3.3
AA Large
3.7
AA Large
3.6
AA Large
1.2
Fail
—
2.7
Fail
3.0
Fail
2.9
Fail
3.3
AA Large
2.7
Fail
—
1.1
Fail
1.1
Fail
3.7
AA Large
3.0
Fail
1.1
Fail
—
1.0
Fail
3.6
AA Large
2.9
Fail
1.1
Fail
1.0
Fail
—
White BG
4.4AA Large
3.6AA Large
1.3Fail
1.2Fail
1.3Fail
Black BG
4.7AA
5.8AA
15.7AAA
17.4AAA
16.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7B7B75
83839A
D3D4DA
E7E7E4
E9E9E5

Deuteranopia

7C7D75
838399
D1CFDB
E6E6E5
EAEBE5

Tritanopia

7F7575
829594
C7DDDE
E3E6E7
EDE5E5

Achromatopsia

787878
878787
DADADA
E8E8E8
E7E7E7

Shades & Tints Shades & Tints

#807575

Dark
Light

#8285A1

Dark
Light

#C5E6D6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #807575;
  --color-2: #8285a1;
  --color-3: #c5e6d6;
  --color-4: #e3ece2;
  --color-5: #eee3e6;
}

SCSS

$color-1: #807575;
$color-2: #8285a1;
$color-3: #c5e6d6;
$color-4: #e3ece2;
$color-5: #eee3e6;

TAILWIND

colors: {
  'brand-1': '#807575',
  'brand-2': '#8285a1',
  'brand-3': '#c5e6d6',
  'brand-4': '#e3ece2',
  'brand-5': '#eee3e6',
}

RGB Array

[128, 117, 117], [130, 133, 161], [197, 230, 214], [227, 236, 226], [238, 227, 230]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #807575, #8285A1, #C5E6D6, #E3ECE2, #EEE3E6 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #807575; --color-2: #8285a1; --color-3: #c5e6d6; --color-4: #e3ece2; --color-5: #eee3e6. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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