← Back to Editor

#D8E4DD · #F7EAD9 · #FAB2AE · #FB9592 · #7B6B83

sea

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#D8E4DD

Celadon · LightGray · Mint Green

HEX
#D8E4DD
RGB
rgb(216, 228, 221)
HSL
hsl(145, 18%, 87%)
HSB
hsb(145, 5%, 89%)
CMYK
cmyk(5%, 0%, 3%, 11%)
Oklch
oklch(90.8% 0.016 160.6)

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

#F7EAD9

Goose Yellow · Beige · Peach Orange

HEX
#F7EAD9
RGB
rgb(247, 234, 217)
HSL
hsl(34, 65%, 91%)
HSB
hsb(34, 12%, 97%)
CMYK
cmyk(0%, 5%, 12%, 3%)
Oklch
oklch(94.3% 0.027 74.8)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#FAB2AE

Peach Pink · LightPink · Cherry Blossom

HEX
#FAB2AE
RGB
rgb(250, 178, 174)
HSL
hsl(3, 88%, 83%)
HSB
hsb(3, 30%, 98%)
CMYK
cmyk(0%, 29%, 30%, 2%)
Oklch
oklch(83.0% 0.085 22.6)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#FB9592

Peach Pink · LightSalmon · Coral Red

HEX
#FB9592
RGB
rgb(251, 149, 146)
HSL
hsl(2, 93%, 78%)
HSB
hsb(2, 42%, 98%)
CMYK
cmyk(0%, 41%, 42%, 2%)
Oklch
oklch(77.6% 0.123 22.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#7B6B83

Dark Plum · Gray · Violet

HEX
#7B6B83
RGB
rgb(123, 107, 131)
HSL
hsl(280, 10%, 47%)
HSB
hsb(280, 18%, 51%)
CMYK
cmyk(6%, 18%, 0%, 49%)
Oklch
oklch(55.1% 0.041 314.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D8E4DD
E4D8DF

Analogous

D9E4D8
D8E4DD
D8E4E3

Triadic

D8E4DD
DDD8E4
E4DDD8

Split-Comp.

D8E4DD
E3D8E4
E4D8D9

Tetradic

D8E4DD
D8D9E4
E4D8DF
E4E3D8

Contrast Matrix WCAG 2.1 Contrast

D8E4DD
F7EAD9
FAB2AE
FB9592
7B6B83
—
1.1
Fail
1.3
Fail
1.6
Fail
3.8
AA Large
1.1
Fail
—
1.5
Fail
1.8
Fail
4.1
AA Large
1.3
Fail
1.5
Fail
—
1.2
Fail
2.8
Fail
1.6
Fail
1.8
Fail
1.2
Fail
—
2.3
Fail
3.8
AA Large
4.1
AA Large
2.8
Fail
2.3
Fail
—
White BG
1.3Fail
1.2Fail
1.7Fail
2.1Fail
4.9AA
Black BG
16.1AAA
17.7AAA
12.0AAA
9.8AAA
4.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDDF
F1F1DD
DBDAAF
CFCE93
74747D

Deuteranopia

DDDCDF
F2F3DE
DFE4AF
D5DC93
75767C

Tritanopia

D9E0E0
F6E0E1
F6B0B0
F69393
7A7978

Achromatopsia

E0E0E0
ECECEC
C7C7C7
B3B3B3
737373

Shades & Tints Shades & Tints

#D8E4DD

Dark
Light

#F7EAD9

Dark
Light

#FAB2AE

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d8e4dd;
  --color-2: #f7ead9;
  --color-3: #fab2ae;
  --color-4: #fb9592;
  --color-5: #7b6b83;
}

SCSS

$color-1: #d8e4dd;
$color-2: #f7ead9;
$color-3: #fab2ae;
$color-4: #fb9592;
$color-5: #7b6b83;

TAILWIND

colors: {
  'brand-1': '#d8e4dd',
  'brand-2': '#f7ead9',
  'brand-3': '#fab2ae',
  'brand-4': '#fb9592',
  'brand-5': '#7b6b83',
}

RGB Array

[216, 228, 221], [247, 234, 217], [250, 178, 174], [251, 149, 146], [123, 107, 131]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #D8E4DD, #F7EAD9, #FAB2AE, #FB9592, #7B6B83 is ideal for: health products, baby brands, fresh-style blogs, 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: #d8e4dd; --color-2: #f7ead9; --color-3: #fab2ae; --color-4: #fb9592; --color-5: #7b6b83. 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 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