#DBECD0 + #FFFFFF + #CEE0AF + #FEE8D1 + #F3A485 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#DBECD0

Celadon · LightGray · Mint Green

HEX

#DBECD0

RGB

rgb(219, 236, 208)

HSL

hsl(96, 42%, 87%)

HSB

hsb(96, 12%, 93%)

CMYK

cmyk(7%, 0%, 12%, 7%)

Oklch

oklch(92.3% 0.041 133.0)

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

#FFFFFF

Moonlight White · White · Cloud White

HEX

#FFFFFF

RGB

rgb(255, 255, 255)

HSL

hsl(0, 0%, 100%)

HSB

hsb(0, 0%, 100%)

CMYK

cmyk(0%, 0%, 0%, 0%)

Oklch

oklch(100.0% 0.000 89.9)

Traditional「Moonlight White」· Paint「Cloud White」· Creative Morning Mist

#CEE0AF

Willow Green · LightGray · Apple Green

HEX

#CEE0AF

RGB

rgb(206, 224, 175)

HSL

hsl(82, 44%, 78%)

HSB

hsb(82, 22%, 88%)

CMYK

cmyk(8%, 0%, 22%, 12%)

Oklch

oklch(88.1% 0.068 124.2)

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

#FEE8D1

Goose Yellow · Bisque · Peach Orange

HEX

#FEE8D1

RGB

rgb(254, 232, 209)

HSL

hsl(31, 96%, 91%)

HSB

hsb(31, 18%, 100%)

CMYK

cmyk(0%, 9%, 18%, 0%)

Oklch

oklch(94.3% 0.039 68.6)

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

#F3A485

Apricot · LightSalmon · Warm Sun

HEX

#F3A485

RGB

rgb(243, 164, 133)

HSL

hsl(17, 82%, 74%)

HSB

hsb(17, 45%, 95%)

CMYK

cmyk(0%, 33%, 45%, 5%)

Oklch

oklch(78.9% 0.104 42.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DBECD0

E1D0EC

Analogous

E9ECD0

DBECD0

D0ECD3

Triadic

DBECD0

D0DBEC

ECD0DB

Split-Comp.

DBECD0

D3D0EC

ECD0E9

Tetradic

DBECD0

D0E9EC

E1D0EC

ECD3D0

Contrast Matrix WCAG 2.1 Contrast

DBECD0	FFFFFF	CEE0AF	FEE8D1	F3A485
—	1.2 Fail	1.1 Fail	1.0 Fail	1.6 Fail
1.2 Fail	—	1.4 Fail	1.2 Fail	2.0 Fail
1.1 Fail	1.4 Fail	—	1.2 Fail	1.4 Fail
1.0 Fail	1.2 Fail	1.2 Fail	—	1.7 Fail
1.6 Fail	2.0 Fail	1.4 Fail	1.7 Fail	—

White BG

1.2Fail

1.0Fail

1.4Fail

1.2Fail

2.0Fail

Black BG

16.9AAA

21.0AAA

14.9AAA

17.7AAA

10.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E2E3D7

FFFFFF

D6D6BB

F4F4D7

D1D08D

Deuteranopia

E1E0D8

FFFFFF

D5D3BE

F6F7D8

D5DB8E

Tritanopia

DCDCDD

FFFFFF

CFC4C6

FDDBDC

EF9294

Achromatopsia

E4E4E4

FFFFFF

D5D5D5

ECECEC

B8B8B8

Shades & Tints Shades & Tints

#DBECD0

Dark

Light

#FFFFFF

Dark

Light

#CEE0AF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dbecd0;
  --color-2: #ffffff;
  --color-3: #cee0af;
  --color-4: #fee8d1;
  --color-5: #f3a485;
}

SCSS

$color-1: #dbecd0;
$color-2: #ffffff;
$color-3: #cee0af;
$color-4: #fee8d1;
$color-5: #f3a485;

TAILWIND

colors: {
  'brand-1': '#dbecd0',
  'brand-2': '#ffffff',
  'brand-3': '#cee0af',
  'brand-4': '#fee8d1',
  'brand-5': '#f3a485',
}

RGB Array

[219, 236, 208], [255, 255, 255], [206, 224, 175], [254, 232, 209], [243, 164, 133]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #DBECD0, #FFFFFF, #CEE0AF, #FEE8D1, #F3A485 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: #dbecd0; --color-2: #ffffff; --color-3: #cee0af; --color-4: #fee8d1; --color-5: #f3a485. 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