← Back to Editor

#E3D4D5 · #DAC1F7 · #77CAD2 · #0ECCB5 · #0D8E89

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#E3D4D5

Peach Pink · LightGray · Cherry Blossom

HEX
#E3D4D5
RGB
rgb(227, 212, 213)
HSL
hsl(356, 21%, 86%)
HSB
hsb(356, 7%, 89%)
CMYK
cmyk(0%, 7%, 6%, 11%)
Oklch
oklch(88.2% 0.017 12.8)

TraditionalPeach Pink」· PaintCherry Blossom」· Creative Rose Petal

#DAC1F7

Wisteria · Lavender · Lavender

HEX
#DAC1F7
RGB
rgb(218, 193, 247)
HSL
hsl(268, 77%, 86%)
HSB
hsb(268, 22%, 97%)
CMYK
cmyk(12%, 22%, 0%, 3%)
Oklch
oklch(85.0% 0.078 305.8)

TraditionalWisteria」· PaintLavender」· Creative Lavender Dream

#77CAD2

Sky Blue · SkyBlue · Lake Green

HEX
#77CAD2
RGB
rgb(119, 202, 210)
HSL
hsl(185, 50%, 65%)
HSB
hsb(185, 43%, 82%)
CMYK
cmyk(43%, 4%, 0%, 18%)
Oklch
oklch(78.9% 0.082 203.6)

TraditionalSky Blue」· PaintLake Green」· Creative Arctic Pool

#0ECCB5

Mineral Blue · DarkTurquoise · Mint Ice

HEX
#0ECCB5
RGB
rgb(14, 204, 181)
HSL
hsl(173, 87%, 43%)
HSB
hsb(173, 93%, 80%)
CMYK
cmyk(93%, 0%, 11%, 20%)
Oklch
oklch(75.8% 0.135 180.8)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

#0D8E89

Mineral Blue · Teal · Mint Ice

HEX
#0D8E89
RGB
rgb(13, 142, 137)
HSL
hsl(178, 83%, 30%)
HSB
hsb(178, 91%, 56%)
CMYK
cmyk(91%, 0%, 4%, 44%)
Oklch
oklch(58.5% 0.099 190.4)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E3D4D5
D4E3E2

Analogous

E3D4DC
E3D4D5
E3DAD4

Triadic

E3D4D5
D5E3D4
D4D5E3

Split-Comp.

E3D4D5
D4E3DA
D4DCE3

Tetradic

E3D4D5
DCE3D4
D4E3E2
DAD4E3

Contrast Matrix WCAG 2.1 Contrast

E3D4D5
DAC1F7
77CAD2
0ECCB5
0D8E89
1.1
Fail
1.3
Fail
1.4
Fail
2.8
Fail
1.1
Fail
1.2
Fail
1.3
Fail
2.5
Fail
1.3
Fail
1.2
Fail
1.1
Fail
2.1
Fail
1.4
Fail
1.3
Fail
1.1
Fail
2.0
Fail
2.8
Fail
2.5
Fail
2.1
Fail
2.0
Fail
White BG
1.4Fail
1.6Fail
1.9Fail
2.0Fail
4.0AA Large
Black BG
14.6AAA
13.0AAA
11.2AAA
10.3AAA
5.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDCD5
CFCFEA
9B9CD0
6062BB
45468A

Deuteranopia

DDDED5
D1D3E7
9690D0
5547BC
3D348B

Tritanopia

E2D5D5
D9E0DD
7BCFCE
18BFC0
138B8B

Achromatopsia

D9D9D9
CFCFCF
B2B2B2
919191
676767

Shades & Tints Shades & Tints

#E3D4D5

Dark
Light

#DAC1F7

Dark
Light

#77CAD2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e3d4d5;
  --color-2: #dac1f7;
  --color-3: #77cad2;
  --color-4: #0eccb5;
  --color-5: #0d8e89;
}

SCSS

$color-1: #e3d4d5;
$color-2: #dac1f7;
$color-3: #77cad2;
$color-4: #0eccb5;
$color-5: #0d8e89;

TAILWIND

colors: {
  'brand-1': '#e3d4d5',
  'brand-2': '#dac1f7',
  'brand-3': '#77cad2',
  'brand-4': '#0eccb5',
  'brand-5': '#0d8e89',
}

RGB Array

[227, 212, 213], [218, 193, 247], [119, 202, 210], [14, 204, 181], [13, 142, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E3D4D5, #DAC1F7, #77CAD2, #0ECCB5, #0D8E89 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #e3d4d5; --color-2: #dac1f7; --color-3: #77cad2; --color-4: #0eccb5; --color-5: #0d8e89. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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 general-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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