#D5E3D4 + #74B2A7 + #ECD8BF + #E86790 + #E03F71 · sea - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D5E3D4

Celadon · LightGray · Mint Green

HEX

#D5E3D4

RGB

rgb(213, 227, 212)

HSL

hsl(116, 21%, 86%)

HSB

hsb(116, 7%, 89%)

CMYK

cmyk(6%, 0%, 7%, 11%)

Oklch

oklch(90.1% 0.025 143.5)

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

#74B2A7

Mineral Blue · CadetBlue · Lake Green

HEX

#74B2A7

RGB

rgb(116, 178, 167)

HSL

hsl(169, 29%, 58%)

HSB

hsb(169, 35%, 70%)

CMYK

cmyk(35%, 0%, 6%, 30%)

Oklch

oklch(71.8% 0.066 182.0)

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

#ECD8BF

Goose Yellow · Wheat · Peach Orange

HEX

#ECD8BF

RGB

rgb(236, 216, 191)

HSL

hsl(33, 54%, 84%)

HSB

hsb(33, 19%, 93%)

CMYK

cmyk(0%, 8%, 19%, 7%)

Oklch

oklch(89.2% 0.040 73.4)

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

#E86790

Rouge · LightCoral · Rose Pink

HEX

#E86790

RGB

rgb(232, 103, 144)

HSL

hsl(341, 74%, 66%)

HSB

hsb(341, 56%, 91%)

CMYK

cmyk(0%, 56%, 38%, 9%)

Oklch

oklch(68.2% 0.164 2.5)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#E03F71

Dark Violet · MediumVioletRed · Rose Pink

HEX

#E03F71

RGB

rgb(224, 63, 113)

HSL

hsl(341, 72%, 56%)

HSB

hsb(341, 72%, 88%)

CMYK

cmyk(0%, 72%, 50%, 12%)

Oklch

oklch(61.6% 0.199 6.7)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5E3D4

E2D4E3

Analogous

DCE3D4

D5E3D4

D4E3DA

Triadic

D5E3D4

D4D5E3

E3D4D5

Split-Comp.

D5E3D4

DAD4E3

E3D4DC

Tetradic

D5E3D4

D4DCE3

E2D4E3

E3DAD4

Contrast Matrix WCAG 2.1 Contrast

D5E3D4	74B2A7	ECD8BF	E86790	E03F71
—	1.8 Fail	1.0 Fail	2.3 Fail	3.1 AA Large
1.8 Fail	—	1.7 Fail	1.3 Fail	1.7 Fail
1.0 Fail	1.7 Fail	—	2.2 Fail	3.0 Fail
2.3 Fail	1.3 Fail	2.2 Fail	—	1.3 Fail
3.1 AA Large	1.7 Fail	3.0 Fail	1.3 Fail	—

White BG

1.3Fail

2.4Fail

1.4Fail

3.1AA Large

4.1AA Large

Black BG

15.8AAA

8.7AAA

15.1AAA

6.8AA

5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDBD8

8F8FAA

E3E3C5

B0AF86

9A9965

Deuteranopia

DAD9D8

8B87AA

E5E6C7

B8C184

A4B062

Tritanopia

D6DADB

77ACAC

EBCACB

E27E7D

D85B59

Achromatopsia

DDDDDD

9E9E9E

DBDBDB

929292

757575

Shades & Tints Shades & Tints

#D5E3D4

Dark

Light

#74B2A7

Dark

Light

#ECD8BF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5e3d4;
  --color-2: #74b2a7;
  --color-3: #ecd8bf;
  --color-4: #e86790;
  --color-5: #e03f71;
}

SCSS

$color-1: #d5e3d4;
$color-2: #74b2a7;
$color-3: #ecd8bf;
$color-4: #e86790;
$color-5: #e03f71;

TAILWIND

colors: {
  'brand-1': '#d5e3d4',
  'brand-2': '#74b2a7',
  'brand-3': '#ecd8bf',
  'brand-4': '#e86790',
  'brand-5': '#e03f71',
}

RGB Array

[213, 227, 212], [116, 178, 167], [236, 216, 191], [232, 103, 144], [224, 63, 113]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sea-style palette of #D5E3D4, #74B2A7, #ECD8BF, #E86790, #E03F71 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: #d5e3d4; --color-2: #74b2a7; --color-3: #ecd8bf; --color-4: #e86790; --color-5: #e03f71. 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