#FFE9D4 + #8CECF1 + #D0C9D6 + #A9C7B2 + #61C2B4 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFE9D4

Apricot · Bisque · Peach Orange

HEX

#FFE9D4

RGB

rgb(255, 233, 212)

HSL

hsl(29, 100%, 92%)

HSB

hsb(29, 17%, 100%)

CMYK

cmyk(0%, 9%, 17%, 0%)

Oklch

oklch(94.6% 0.037 66.0)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#8CECF1

Sky Blue · SkyBlue · Lake Green

HEX

#8CECF1

RGB

rgb(140, 236, 241)

HSL

hsl(183, 78%, 75%)

HSB

hsb(183, 42%, 95%)

CMYK

cmyk(42%, 2%, 0%, 5%)

Oklch

oklch(88.6% 0.091 200.0)

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

#D0C9D6

Lilac · LightGray · Lavender

HEX

#D0C9D6

RGB

rgb(208, 201, 214)

HSL

hsl(272, 14%, 81%)

HSB

hsb(272, 6%, 84%)

CMYK

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

Oklch

oklch(84.5% 0.019 309.8)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

#A9C7B2

Celadon · Silver · Apple Green

HEX

#A9C7B2

RGB

rgb(169, 199, 178)

HSL

hsl(138, 21%, 72%)

HSB

hsb(138, 15%, 78%)

CMYK

cmyk(15%, 0%, 11%, 22%)

Oklch

oklch(80.1% 0.044 154.8)

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

#61C2B4

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#61C2B4

RGB

rgb(97, 194, 180)

HSL

hsl(171, 44%, 57%)

HSB

hsb(171, 50%, 76%)

CMYK

cmyk(50%, 0%, 7%, 24%)

Oklch

oklch(75.1% 0.094 183.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFE9D4

D6EBFF

Analogous

FFD6D7

FFE9D4

FFFED6

Triadic

FFE9D4

D6FFEA

EAD6FF

Split-Comp.

FFE9D4

D6FFFE

D6D7FF

Tetradic

FFE9D4

D7FFD6

D6EBFF

FED6FF

Contrast Matrix WCAG 2.1 Contrast

FFE9D4	8CECF1	D0C9D6	A9C7B2	61C2B4
—	1.2 Fail	1.4 Fail	1.6 Fail	1.8 Fail
1.2 Fail	—	1.2 Fail	1.3 Fail	1.6 Fail
1.4 Fail	1.2 Fail	—	1.1 Fail	1.3 Fail
1.6 Fail	1.3 Fail	1.1 Fail	—	1.2 Fail
1.8 Fail	1.6 Fail	1.3 Fail	1.2 Fail	—

White BG

1.2Fail

1.4Fail

1.6Fail

1.8Fail

2.1Fail

Black BG

17.9AAA

15.4AAA

13.0AAA

11.5AAA

9.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F5F5D9

B6B6F0

CDCDD3

B6B6B7

8B8CB7

Deuteranopia

F7F8DA

B0A9F0

CDCED2

B4B2B8

857EB8

Tritanopia

FEDDDE

91EFEF

D0D0D0

AABBBC

66BABB

Achromatopsia

EDEDED

D0D0D0

CDCDCD

BCBCBC

A3A3A3

Shades & Tints Shades & Tints

#FFE9D4

Dark

Light

#8CECF1

Dark

Light

#D0C9D6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffe9d4;
  --color-2: #8cecf1;
  --color-3: #d0c9d6;
  --color-4: #a9c7b2;
  --color-5: #61c2b4;
}

SCSS

$color-1: #ffe9d4;
$color-2: #8cecf1;
$color-3: #d0c9d6;
$color-4: #a9c7b2;
$color-5: #61c2b4;

TAILWIND

colors: {
  'brand-1': '#ffe9d4',
  'brand-2': '#8cecf1',
  'brand-3': '#d0c9d6',
  'brand-4': '#a9c7b2',
  'brand-5': '#61c2b4',
}

RGB Array

[255, 233, 212], [140, 236, 241], [208, 201, 214], [169, 199, 178], [97, 194, 180]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #FFE9D4, #8CECF1, #D0C9D6, #A9C7B2, #61C2B4 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: #ffe9d4; --color-2: #8cecf1; --color-3: #d0c9d6; --color-4: #a9c7b2; --color-5: #61c2b4. 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