← Back to Editor

#7DDED5 · #5F7BAA · #F59DA9 · #FFE5D6

A 4-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 App

Color Details Color Details

#7DDED5

Jade · SkyBlue · Lake Green

HEX
#7DDED5
RGB
rgb(125, 222, 213)
HSL
hsl(174, 60%, 68%)
HSB
hsb(174, 44%, 87%)
CMYK
cmyk(44%, 0%, 4%, 13%)
Oklch
oklch(83.9% 0.093 187.8)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

#5F7BAA

Azure · SteelBlue · Navy Blue

HEX
#5F7BAA
RGB
rgb(95, 123, 170)
HSL
hsl(218, 31%, 52%)
HSB
hsb(218, 44%, 67%)
CMYK
cmyk(44%, 28%, 0%, 33%)
Oklch
oklch(58.1% 0.080 260.5)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#F59DA9

Peach Pink · LightPink · Coral Red

HEX
#F59DA9
RGB
rgb(245, 157, 169)
HSL
hsl(352, 81%, 79%)
HSB
hsb(352, 36%, 96%)
CMYK
cmyk(0%, 36%, 31%, 4%)
Oklch
oklch(78.7% 0.106 10.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#FFE5D6

Apricot · Bisque · Peach Orange

HEX
#FFE5D6
RGB
rgb(255, 229, 214)
HSL
hsl(22, 100%, 92%)
HSB
hsb(22, 16%, 100%)
CMYK
cmyk(0%, 10%, 16%, 0%)
Oklch
oklch(93.9% 0.035 52.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7DDED5
DE7C86

Analogous

7CDEA4
7DDED5
7CB7DE

Triadic

7DDED5
D57CDE
DED57C

Split-Comp.

7DDED5
DE7CB7
DEA47C

Tetradic

7DDED5
A47CDE
DE7C86
B7DE7C

Contrast Matrix WCAG 2.1 Contrast

7DDED5
5F7BAA
F59DA9
FFE5D6
—
2.7
Fail
1.3
Fail
1.3
Fail
2.7
Fail
—
2.1
Fail
3.6
AA Large
1.3
Fail
2.1
Fail
—
1.7
Fail
1.3
Fail
3.6
AA Large
1.7
Fail
—
White BG
1.6Fail
4.3AA Large
2.0Fail
1.2Fail
Black BG
13.3AAA
4.9AA
10.3AAA
17.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A8D7
6B6B9F
CFCEA6
F4F4DA

Deuteranopia

A19AD8
6A679C
D4DBA5
F5F7DB

Tritanopia

82D9D9
609694
F1A4A3
FEDCDD

Achromatopsia

C0C0C0
787878
B9B9B9
EBEBEB

Shades & Tints Shades & Tints

#7DDED5

Dark
Light

#5F7BAA

Dark
Light

#F59DA9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7dded5;
  --color-2: #5f7baa;
  --color-3: #f59da9;
  --color-4: #ffe5d6;
}

SCSS

$color-1: #7dded5;
$color-2: #5f7baa;
$color-3: #f59da9;
$color-4: #ffe5d6;

TAILWIND

colors: {
  'brand-1': '#7dded5',
  'brand-2': '#5f7baa',
  'brand-3': '#f59da9',
  'brand-4': '#ffe5d6',
}

RGB Array

[125, 222, 213], [95, 123, 170], [245, 157, 169], [255, 229, 214]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This general-style palette of #7DDED5, #5F7BAA, #F59DA9, #FFE5D6 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 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #7dded5; --color-2: #5f7baa; --color-3: #f59da9; --color-4: #ffe5d6. 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 4-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