← Back to Editor

#5E647C · #747E7D · #C1A482 · #F2E5EC · #D8D552

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

#5E647C

Indigo · DimGray · Navy Blue

HEX
#5E647C
RGB
rgb(94, 100, 124)
HSL
hsl(228, 14%, 43%)
HSB
hsb(228, 24%, 49%)
CMYK
cmyk(24%, 19%, 0%, 51%)
Oklch
oklch(50.7% 0.039 274.0)

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

#747E7D

Ink Gray · Gray · Warm Gray

HEX
#747E7D
RGB
rgb(116, 126, 125)
HSL
hsl(174, 4%, 47%)
HSB
hsb(174, 8%, 49%)
CMYK
cmyk(8%, 0%, 1%, 51%)
Oklch
oklch(58.4% 0.012 189.6)

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

#C1A482

Ginger · Tan · Warm Sun

HEX
#C1A482
RGB
rgb(193, 164, 130)
HSL
hsl(32, 34%, 63%)
HSB
hsb(32, 33%, 76%)
CMYK
cmyk(0%, 15%, 33%, 24%)
Oklch
oklch(73.6% 0.058 71.2)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#F2E5EC

Mauve · Linen · Cherry Blossom

HEX
#F2E5EC
RGB
rgb(242, 229, 236)
HSL
hsl(328, 33%, 92%)
HSB
hsb(328, 5%, 95%)
CMYK
cmyk(0%, 5%, 2%, 5%)
Oklch
oklch(93.4% 0.017 343.6)

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

#D8D552

Autumn Sage · SandyBrown · Sunflower

HEX
#D8D552
RGB
rgb(216, 213, 82)
HSL
hsl(59, 63%, 58%)
HSB
hsb(59, 62%, 85%)
CMYK
cmyk(0%, 1%, 62%, 15%)
Oklch
oklch(85.1% 0.151 108.0)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5E647C
7D775E

Analogous

5E747D
5E647C
685E7D

Triadic

5E647C
7D5E64
647D5E

Split-Comp.

5E647C
7D685E
747D5E

Tetradic

5E647C
7D5E74
7D775E
5E7D68

Contrast Matrix WCAG 2.1 Contrast

5E647C
747E7D
C1A482
F2E5EC
D8D552
—
1.4
Fail
2.5
Fail
4.8
AA
3.8
AA Large
1.4
Fail
—
1.8
Fail
3.4
AA Large
2.7
Fail
2.5
Fail
1.8
Fail
—
1.9
Fail
1.5
Fail
4.8
AA
3.4
AA Large
1.9
Fail
—
1.3
Fail
3.8
AA Large
2.7
Fail
1.5
Fail
1.3
Fail
—
White BG
5.8AA
4.2AA Large
2.4Fail
1.2Fail
1.5Fail
Black BG
3.6AA Large
5.0AA
8.9AAA
17.2AAA
13.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

616176
78787D
B4B48A
ECECEA
D7D772

Deuteranopia

606075
78777D
B6B88C
EDEEEA
D7D779

Tritanopia

5E7271
747D7D
C09192
F1E9E9
D88B90

Achromatopsia

656565
7B7B7B
A9A9A9
EAEAEA
C7C7C7

Shades & Tints Shades & Tints

#5E647C

Dark
Light

#747E7D

Dark
Light

#C1A482

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5e647c;
  --color-2: #747e7d;
  --color-3: #c1a482;
  --color-4: #f2e5ec;
  --color-5: #d8d552;
}

SCSS

$color-1: #5e647c;
$color-2: #747e7d;
$color-3: #c1a482;
$color-4: #f2e5ec;
$color-5: #d8d552;

TAILWIND

colors: {
  'brand-1': '#5e647c',
  'brand-2': '#747e7d',
  'brand-3': '#c1a482',
  'brand-4': '#f2e5ec',
  'brand-5': '#d8d552',
}

RGB Array

[94, 100, 124], [116, 126, 125], [193, 164, 130], [242, 229, 236], [216, 213, 82]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #5E647C, #747E7D, #C1A482, #F2E5EC, #D8D552 is ideal for: brand design, premium product pages, magazine layouts, 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: #5e647c; --color-2: #747e7d; --color-3: #c1a482; --color-4: #f2e5ec; --color-5: #d8d552. 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. 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