#FFD6DA + #EAD4D7 + #CFD3D6 + #B6CCD7 + #9BC7D4 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFD6DA

Peach Pink · Bisque · Cherry Blossom

HEX

#FFD6DA

RGB

rgb(255, 214, 218)

HSL

hsl(354, 100%, 92%)

HSB

hsb(354, 16%, 100%)

CMYK

cmyk(0%, 16%, 15%, 0%)

Oklch

oklch(91.2% 0.046 11.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#EAD4D7

Peach Pink · LightGray · Cherry Blossom

HEX

#EAD4D7

RGB

rgb(234, 212, 215)

HSL

hsl(352, 34%, 87%)

HSB

hsb(352, 9%, 92%)

CMYK

cmyk(0%, 9%, 8%, 8%)

Oklch

oklch(88.9% 0.025 8.2)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#CFD3D6

Sky Blue · LightGray · Pearl Gray

HEX

#CFD3D6

RGB

rgb(207, 211, 214)

HSL

hsl(206, 8%, 83%)

HSB

hsb(206, 3%, 84%)

CMYK

cmyk(3%, 1%, 0%, 16%)

Oklch

oklch(86.5% 0.006 239.8)

Traditional「Sky Blue」· Paint「Pearl Gray」· Creative Silver Lining

#B6CCD7

Sky Blue · LightSteelBlue · Cobalt Blue

HEX

#B6CCD7

RGB

rgb(182, 204, 215)

HSL

hsl(200, 29%, 78%)

HSB

hsb(200, 15%, 84%)

CMYK

cmyk(15%, 5%, 0%, 16%)

Oklch

oklch(83.2% 0.028 229.2)

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

#9BC7D4

Sky Blue · LightSteelBlue · Lake Green

HEX

#9BC7D4

RGB

rgb(155, 199, 212)

HSL

hsl(194, 40%, 72%)

HSB

hsb(194, 27%, 83%)

CMYK

cmyk(27%, 6%, 0%, 17%)

Oklch

oklch(80.3% 0.050 217.8)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFD6DA

D6FFFB

Analogous

FFD6EF

FFD6DA

FFE7D6

Triadic

FFD6DA

DAFFD6

D6DAFF

Split-Comp.

FFD6DA

D6FFE7

D6EFFF

Tetradic

FFD6DA

EFFFD6

D6FFFB

E7D6FF

Contrast Matrix WCAG 2.1 Contrast

FFD6DA	EAD4D7	CFD3D6	B6CCD7	9BC7D4
—	1.1 Fail	1.1 Fail	1.3 Fail	1.4 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.3 Fail
1.1 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.3 Fail	1.2 Fail	1.1 Fail	—	1.1 Fail
1.4 Fail	1.3 Fail	1.2 Fail	1.1 Fail	—

White BG

1.3Fail

1.4Fail

1.5Fail

1.7Fail

1.8Fail

Black BG

15.9AAA

14.9AAA

13.9AAA

12.6AAA

11.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDD9

E0E0D6

D1D1D5

C0C0D4

AEAED1

Deuteranopia

F0F3D9

E2E3D6

D1D0D5

BEBDD4

ACA8D0

Tritanopia

FDD8D8

E9D6D6

CFD5D5

B7D2D2

9DCECE

Achromatopsia

E3E3E3

DBDBDB

D2D2D2

C7C7C7

BBBBBB

Shades & Tints Shades & Tints

#FFD6DA

Dark

Light

#EAD4D7

Dark

Light

#CFD3D6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffd6da;
  --color-2: #ead4d7;
  --color-3: #cfd3d6;
  --color-4: #b6ccd7;
  --color-5: #9bc7d4;
}

SCSS

$color-1: #ffd6da;
$color-2: #ead4d7;
$color-3: #cfd3d6;
$color-4: #b6ccd7;
$color-5: #9bc7d4;

TAILWIND

colors: {
  'brand-1': '#ffd6da',
  'brand-2': '#ead4d7',
  'brand-3': '#cfd3d6',
  'brand-4': '#b6ccd7',
  'brand-5': '#9bc7d4',
}

RGB Array

[255, 214, 218], [234, 212, 215], [207, 211, 214], [182, 204, 215], [155, 199, 212]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #FFD6DA, #EAD4D7, #CFD3D6, #B6CCD7, #9BC7D4 is ideal for: health products, baby brands, fresh-style blogs. 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: #ffd6da; --color-2: #ead4d7; --color-3: #cfd3d6; --color-4: #b6ccd7; --color-5: #9bc7d4. 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. 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