#EC405B + #CE7C5B + #B2BE59 + #A3D9C1 + #D0F3D9 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EC405B

Vermilion · Tomato · Passion Red

HEX

#EC405B

RGB

rgb(236, 64, 91)

HSL

hsl(351, 82%, 59%)

HSB

hsb(351, 73%, 93%)

CMYK

cmyk(0%, 73%, 61%, 7%)

Oklch

oklch(63.2% 0.207 16.9)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

#CE7C5B

Tangerine · DarkSalmon · Warm Sun

HEX

#CE7C5B

RGB

rgb(206, 124, 91)

HSL

hsl(17, 54%, 58%)

HSB

hsb(17, 56%, 81%)

CMYK

cmyk(0%, 40%, 56%, 19%)

Oklch

oklch(66.7% 0.113 42.4)

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

#B2BE59

Autumn Sage · Tan · Sunflower

HEX

#B2BE59

RGB

rgb(178, 190, 89)

HSL

hsl(67, 44%, 55%)

HSB

hsb(67, 53%, 75%)

CMYK

cmyk(6%, 0%, 53%, 25%)

Oklch

oklch(77.1% 0.127 115.0)

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

#A3D9C1

Jade · LightSteelBlue · Apple Green

HEX

#A3D9C1

RGB

rgb(163, 217, 193)

HSL

hsl(153, 42%, 75%)

HSB

hsb(153, 25%, 85%)

CMYK

cmyk(25%, 0%, 11%, 15%)

Oklch

oklch(84.1% 0.065 165.8)

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

#D0F3D9

Emerald · LightGray · Mint Green

HEX

#D0F3D9

RGB

rgb(208, 243, 217)

HSL

hsl(135, 59%, 88%)

HSB

hsb(135, 14%, 95%)

CMYK

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

Oklch

oklch(93.2% 0.050 153.2)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EC405B

41ECD2

Analogous

EC41B0

EC405B

EC7D41

Triadic

EC405B

5AEC41

415AEC

Split-Comp.

EC405B

41EC7D

41B0EC

Tetradic

EC405B

B0EC41

41ECD2

7D41EC

Contrast Matrix WCAG 2.1 Contrast

EC405B	CE7C5B	B2BE59	A3D9C1	D0F3D9
—	1.2 Fail	1.9 Fail	2.4 Fail	3.2 AA Large
1.2 Fail	—	1.6 Fail	2.0 Fail	2.6 Fail
1.9 Fail	1.6 Fail	—	1.3 Fail	1.7 Fail
2.4 Fail	2.0 Fail	1.3 Fail	—	1.3 Fail
3.2 AA Large	2.6 Fail	1.7 Fail	1.3 Fail	—

White BG

3.9AA Large

3.2AA Large

2.0Fail

1.6Fail

1.2Fail

Black BG

5.5AA

6.7AA

10.4AAA

13.3AAA

17.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A054

AAAA63

B7B771

BABBC7

DFDFDF

Deuteranopia

ACB853

AFB565

B7B677

B7B3C8

DDDBE1

Tritanopia

E34F4E

CA696B

B38589

A6CBCC

D2E4E5

Achromatopsia

777777

919191

AFAFAF

C6C6C6

E6E6E6

Shades & Tints Shades & Tints

#EC405B

Dark

Light

#CE7C5B

Dark

Light

#B2BE59

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ec405b;
  --color-2: #ce7c5b;
  --color-3: #b2be59;
  --color-4: #a3d9c1;
  --color-5: #d0f3d9;
}

SCSS

$color-1: #ec405b;
$color-2: #ce7c5b;
$color-3: #b2be59;
$color-4: #a3d9c1;
$color-5: #d0f3d9;

TAILWIND

colors: {
  'brand-1': '#ec405b',
  'brand-2': '#ce7c5b',
  'brand-3': '#b2be59',
  'brand-4': '#a3d9c1',
  'brand-5': '#d0f3d9',
}

RGB Array

[236, 64, 91], [206, 124, 91], [178, 190, 89], [163, 217, 193], [208, 243, 217]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EC405B, #CE7C5B, #B2BE59, #A3D9C1, #D0F3D9 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: #ec405b; --color-2: #ce7c5b; --color-3: #b2be59; --color-4: #a3d9c1; --color-5: #d0f3d9. 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 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