#ED9EA3 + #F4C7B4 + #A2B9B3 + #7E8386 + #D3BA55 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#ED9EA3

Peach Pink · BurlyWood · Coral Red

HEX

#ED9EA3

RGB

rgb(237, 158, 163)

HSL

hsl(356, 69%, 77%)

HSB

hsb(356, 33%, 93%)

CMYK

cmyk(0%, 33%, 31%, 7%)

Oklch

oklch(77.8% 0.095 15.3)

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

#F4C7B4

Apricot · Wheat · Peach Orange

HEX

#F4C7B4

RGB

rgb(244, 199, 180)

HSL

hsl(18, 74%, 83%)

HSB

hsb(18, 26%, 96%)

CMYK

cmyk(0%, 18%, 26%, 4%)

Oklch

oklch(86.4% 0.058 44.1)

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

#A2B9B3

Jade · DarkGray · Lake Green

HEX

#A2B9B3

RGB

rgb(162, 185, 179)

HSL

hsl(164, 14%, 68%)

HSB

hsb(164, 12%, 73%)

CMYK

cmyk(12%, 0%, 3%, 27%)

Oklch

oklch(76.7% 0.027 178.1)

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

#7E8386

Ash · Gray · Warm Gray

HEX

#7E8386

RGB

rgb(126, 131, 134)

HSL

hsl(203, 3%, 51%)

HSB

hsb(203, 6%, 53%)

CMYK

cmyk(6%, 2%, 0%, 47%)

Oklch

oklch(60.7% 0.007 233.7)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#D3BA55

Ginger · SandyBrown · Sunflower

HEX

#D3BA55

RGB

rgb(211, 186, 85)

HSL

hsl(48, 59%, 58%)

HSB

hsb(48, 60%, 83%)

CMYK

cmyk(0%, 12%, 60%, 17%)

Oklch

oklch(79.1% 0.124 95.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ED9EA3

9CEDE7

Analogous

ED9CCA

ED9EA3

EDBF9C

Triadic

ED9EA3

A1ED9C

9CA1ED

Split-Comp.

ED9EA3

9CEDBF

9CCAED

Tetradic

ED9EA3

CAED9C

9CEDE7

BF9CED

Contrast Matrix WCAG 2.1 Contrast

ED9EA3	F4C7B4	A2B9B3	7E8386	D3BA55
—	1.4 Fail	1.0 Fail	1.8 Fail	1.1 Fail
1.4 Fail	—	1.4 Fail	2.5 Fail	1.3 Fail
1.0 Fail	1.4 Fail	—	1.8 Fail	1.1 Fail
1.8 Fail	2.5 Fail	1.8 Fail	—	2.0 Fail
1.1 Fail	1.3 Fail	1.1 Fail	2.0 Fail	—

White BG

2.1Fail

1.5Fail

2.1Fail

3.8AA Large

1.9Fail

Black BG

10.0AAA

13.7AAA

10.1AAA

5.5AA

10.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCAA2

E1E0B9

ACACB4

808085

C8C86D

Deuteranopia

CFD5A2

E3E6BA

ABA9B5

807F85

CACC73

Tritanopia

E9A1A1

F2BCBD

A3B6B6

7E8585

D28185

Achromatopsia

B6B6B6

D2D2D2

B1B1B1

828282

B6B6B6

Shades & Tints Shades & Tints

#ED9EA3

Dark

Light

#F4C7B4

Dark

Light

#A2B9B3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ed9ea3;
  --color-2: #f4c7b4;
  --color-3: #a2b9b3;
  --color-4: #7e8386;
  --color-5: #d3ba55;
}

SCSS

$color-1: #ed9ea3;
$color-2: #f4c7b4;
$color-3: #a2b9b3;
$color-4: #7e8386;
$color-5: #d3ba55;

TAILWIND

colors: {
  'brand-1': '#ed9ea3',
  'brand-2': '#f4c7b4',
  'brand-3': '#a2b9b3',
  'brand-4': '#7e8386',
  'brand-5': '#d3ba55',
}

RGB Array

[237, 158, 163], [244, 199, 180], [162, 185, 179], [126, 131, 134], [211, 186, 85]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #ED9EA3, #F4C7B4, #A2B9B3, #7E8386, #D3BA55 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: #ed9ea3; --color-2: #f4c7b4; --color-3: #a2b9b3; --color-4: #7e8386; --color-5: #d3ba55. 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 cool-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