← Back to Editor

#D3D4DD · #A8E1D4 · #19FAD4 · #CCF553 · #F6F619

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#D3D4DD

Azure · LightGray · Sky Blue

HEX
#D3D4DD
RGB
rgb(211, 212, 221)
HSL
hsl(234, 13%, 85%)
HSB
hsb(234, 5%, 87%)
CMYK
cmyk(5%, 4%, 0%, 13%)
Oklch
oklch(87.2% 0.012 281.1)

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

#A8E1D4

Jade · LightBlue · Glacier Blue

HEX
#A8E1D4
RGB
rgb(168, 225, 212)
HSL
hsl(166, 49%, 77%)
HSB
hsb(166, 25%, 88%)
CMYK
cmyk(25%, 0%, 6%, 12%)
Oklch
oklch(86.7% 0.061 179.2)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#19FAD4

Mineral Blue · Turquoise · Lake Green

HEX
#19FAD4
RGB
rgb(25, 250, 212)
HSL
hsl(170, 96%, 54%)
HSB
hsb(170, 90%, 98%)
CMYK
cmyk(90%, 0%, 15%, 2%)
Oklch
oklch(88.1% 0.162 176.1)

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

#CCF553

Willow Green · GreenYellow · Apple Green

HEX
#CCF553
RGB
rgb(204, 245, 83)
HSL
hsl(75, 89%, 64%)
HSB
hsb(75, 66%, 96%)
CMYK
cmyk(17%, 0%, 66%, 4%)
Oklch
oklch(91.2% 0.189 122.5)

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

#F6F619

Autumn Sage · Yellow · Sunflower

HEX
#F6F619
RGB
rgb(246, 246, 25)
HSL
hsl(60, 92%, 53%)
HSB
hsb(60, 90%, 96%)
CMYK
cmyk(0%, 0%, 90%, 4%)
Oklch
oklch(94.2% 0.202 109.7)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D3D4DD
DEDDD4

Analogous

D4DADE
D3D4DD
D8D4DE

Triadic

D3D4DD
DED4D5
D5DED4

Split-Comp.

D3D4DD
DED8D4
DADED4

Tetradic

D3D4DD
DED4DA
DEDDD4
D4DED8

Contrast Matrix WCAG 2.1 Contrast

D3D4DD
A8E1D4
19FAD4
CCF553
F6F619
—
1.0
Fail
1.1
Fail
1.2
Fail
1.3
Fail
1.0
Fail
—
1.1
Fail
1.2
Fail
1.3
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
1.2
Fail
1.2
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
1.3
Fail
1.3
Fail
1.2
Fail
1.1
Fail
—
White BG
1.5Fail
1.5Fail
1.3Fail
1.3Fail
1.2Fail
Black BG
14.2AAA
14.4AAA
15.7AAA
16.8AAA
18.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D3DB
C1C1D7
7A7CDD
DEDE7A
F6F64E

Deuteranopia

D3D3DA
BDB9D8
6D5DDF
DBD884
F6F65B

Tritanopia

D3D9D9
ABDADA
24E4E6
CE99A0
F67982

Achromatopsia

D5D5D5
CECECE
B2B2B2
D6D6D6
DDDDDD

Shades & Tints Shades & Tints

#D3D4DD

Dark
Light

#A8E1D4

Dark
Light

#19FAD4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d3d4dd;
  --color-2: #a8e1d4;
  --color-3: #19fad4;
  --color-4: #ccf553;
  --color-5: #f6f619;
}

SCSS

$color-1: #d3d4dd;
$color-2: #a8e1d4;
$color-3: #19fad4;
$color-4: #ccf553;
$color-5: #f6f619;

TAILWIND

colors: {
  'brand-1': '#d3d4dd',
  'brand-2': '#a8e1d4',
  'brand-3': '#19fad4',
  'brand-4': '#ccf553',
  'brand-5': '#f6f619',
}

RGB Array

[211, 212, 221], [168, 225, 212], [25, 250, 212], [204, 245, 83], [246, 246, 25]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D3D4DD, #A8E1D4, #19FAD4, #CCF553, #F6F619 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. 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: #d3d4dd; --color-2: #a8e1d4; --color-3: #19fad4; --color-4: #ccf553; --color-5: #f6f619. 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 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