#EC8E44 + #937294 + #938CB8 + #A6ABC1 + #C5C9D9 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EC8E44

Tangerine · Coral · Warm Sun

HEX

#EC8E44

RGB

rgb(236, 142, 68)

HSL

hsl(26, 82%, 60%)

HSB

hsb(26, 71%, 93%)

CMYK

cmyk(0%, 40%, 71%, 7%)

Oklch

oklch(73.3% 0.144 56.0)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#937294

Dark Plum · Gray · Violet

HEX

#937294

RGB

rgb(147, 114, 148)

HSL

hsl(298, 14%, 51%)

HSB

hsb(298, 23%, 58%)

CMYK

cmyk(1%, 23%, 0%, 42%)

Oklch

oklch(59.6% 0.064 325.4)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

#938CB8

Wisteria · DarkGray · Cobalt Blue

HEX

#938CB8

RGB

rgb(147, 140, 184)

HSL

hsl(250, 24%, 64%)

HSB

hsb(250, 24%, 72%)

CMYK

cmyk(20%, 24%, 0%, 28%)

Oklch

oklch(66.2% 0.065 291.8)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#A6ABC1

Azure · DarkGray · Cobalt Blue

HEX

#A6ABC1

RGB

rgb(166, 171, 193)

HSL

hsl(229, 18%, 70%)

HSB

hsb(229, 14%, 76%)

CMYK

cmyk(14%, 11%, 0%, 24%)

Oklch

oklch(74.4% 0.032 275.4)

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

#C5C9D9

Azure · LightGray · Sky Blue

HEX

#C5C9D9

RGB

rgb(197, 201, 217)

HSL

hsl(228, 21%, 81%)

HSB

hsb(228, 9%, 85%)

CMYK

cmyk(9%, 7%, 0%, 15%)

Oklch

oklch(83.8% 0.023 274.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EC8E44

45A4ED

Analogous

ED4551

EC8E44

EDE145

Triadic

EC8E44

45ED8E

8E45ED

Split-Comp.

EC8E44

45EDE1

4551ED

Tetradic

EC8E44

51ED45

45A4ED

E145ED

Contrast Matrix WCAG 2.1 Contrast

EC8E44	937294	938CB8	A6ABC1	C5C9D9
—	1.7 Fail	1.3 Fail	1.1 Fail	1.5 Fail
1.7 Fail	—	1.3 Fail	1.8 Fail	2.5 Fail
1.3 Fail	1.3 Fail	—	1.4 Fail	1.9 Fail
1.1 Fail	1.8 Fail	1.4 Fail	—	1.4 Fail
1.5 Fail	2.5 Fail	1.9 Fail	1.4 Fail	—

White BG

2.5Fail

4.1AA Large

3.1AA Large

2.3Fail

1.6Fail

Black BG

8.5AAA

5.1AA

6.7AA

9.2AAA

12.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C3C256

85848C

9090AD

A8A8BC

C7C7D5

Deuteranopia

C9D05A

87898A

9091AB

A8A8BA

C7C6D4

Tritanopia

E76467

918584

93A5A3

A6B7B7

C5D2D1

Achromatopsia

A2A2A2

808080

939393

ACACAC

CACACA

Shades & Tints Shades & Tints

#EC8E44

Dark

Light

#937294

Dark

Light

#938CB8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ec8e44;
  --color-2: #937294;
  --color-3: #938cb8;
  --color-4: #a6abc1;
  --color-5: #c5c9d9;
}

SCSS

$color-1: #ec8e44;
$color-2: #937294;
$color-3: #938cb8;
$color-4: #a6abc1;
$color-5: #c5c9d9;

TAILWIND

colors: {
  'brand-1': '#ec8e44',
  'brand-2': '#937294',
  'brand-3': '#938cb8',
  'brand-4': '#a6abc1',
  'brand-5': '#c5c9d9',
}

RGB Array

[236, 142, 68], [147, 114, 148], [147, 140, 184], [166, 171, 193], [197, 201, 217]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #EC8E44, #937294, #938CB8, #A6ABC1, #C5C9D9 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: #ec8e44; --color-2: #937294; --color-3: #938cb8; --color-4: #a6abc1; --color-5: #c5c9d9. 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