#E93D63 + #D1787A + #C49E8B + #C7E2D3 + #F6E7D2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E93D63

Vermilion · Tomato · Passion Red

HEX

#E93D63

RGB

rgb(233, 61, 99)

HSL

hsl(347, 80%, 58%)

HSB

hsb(347, 74%, 91%)

CMYK

cmyk(0%, 74%, 58%, 9%)

Oklch

oklch(62.6% 0.207 13.2)

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

#D1787A

Peach Pink · LightCoral · Coral Red

HEX

#D1787A

RGB

rgb(209, 120, 122)

HSL

hsl(359, 49%, 65%)

HSB

hsb(359, 43%, 82%)

CMYK

cmyk(0%, 43%, 42%, 18%)

Oklch

oklch(67.1% 0.111 19.0)

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

#C49E8B

Apricot · Tan · Warm Sun

HEX

#C49E8B

RGB

rgb(196, 158, 139)

HSL

hsl(20, 33%, 66%)

HSB

hsb(20, 29%, 77%)

CMYK

cmyk(0%, 19%, 29%, 23%)

Oklch

oklch(72.9% 0.053 48.0)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#C7E2D3

Celadon · LightGray · Mint Green

HEX

#C7E2D3

RGB

rgb(199, 226, 211)

HSL

hsl(147, 32%, 83%)

HSB

hsb(147, 12%, 89%)

CMYK

cmyk(12%, 0%, 7%, 11%)

Oklch

oklch(88.9% 0.035 161.3)

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

#F6E7D2

Goose Yellow · Bisque · Peach Orange

HEX

#F6E7D2

RGB

rgb(246, 231, 210)

HSL

hsl(35, 67%, 89%)

HSB

hsb(35, 15%, 96%)

CMYK

cmyk(0%, 6%, 15%, 4%)

Oklch

oklch(93.4% 0.032 76.4)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E93D63

3EEAC4

Analogous

EA3EB9

E93D63

EA6F3E

Triadic

E93D63

63EA3E

3E63EA

Split-Comp.

E93D63

3EEA6F

3EB9EA

Tetradic

E93D63

B9EA3E

3EEAC4

6F3EEA

Contrast Matrix WCAG 2.1 Contrast

E93D63	D1787A	C49E8B	C7E2D3	F6E7D2
—	1.3 Fail	1.6 Fail	2.9 Fail	3.3 AA Large
1.3 Fail	—	1.3 Fail	2.3 Fail	2.6 Fail
1.6 Fail	1.3 Fail	—	1.8 Fail	2.0 Fail
2.9 Fail	2.3 Fail	1.8 Fail	—	1.1 Fail
3.3 AA Large	2.6 Fail	2.0 Fail	1.1 Fail	—

White BG

4.0AA Large

3.1AA Large

2.4Fail

1.4Fail

1.2Fail

Black BG

5.3AA

6.7AA

8.6AAA

15.2AAA

17.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9F9D5A

AAAA7A

B4B390

D3D3D7

F0EFD7

Deuteranopia

A9B558

B0B679

B6B991

D1CFD8

F0F2D8

Tritanopia

E05351

CD7979

C29394

C8D9DA

F5DBDC

Achromatopsia

757575

939393

A7A7A7

D8D8D8

E9E9E9

Shades & Tints Shades & Tints

#E93D63

Dark

Light

#D1787A

Dark

Light

#C49E8B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e93d63;
  --color-2: #d1787a;
  --color-3: #c49e8b;
  --color-4: #c7e2d3;
  --color-5: #f6e7d2;
}

SCSS

$color-1: #e93d63;
$color-2: #d1787a;
$color-3: #c49e8b;
$color-4: #c7e2d3;
$color-5: #f6e7d2;

TAILWIND

colors: {
  'brand-1': '#e93d63',
  'brand-2': '#d1787a',
  'brand-3': '#c49e8b',
  'brand-4': '#c7e2d3',
  'brand-5': '#f6e7d2',
}

RGB Array

[233, 61, 99], [209, 120, 122], [196, 158, 139], [199, 226, 211], [246, 231, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E93D63, #D1787A, #C49E8B, #C7E2D3, #F6E7D2 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: #e93d63; --color-2: #d1787a; --color-3: #c49e8b; --color-4: #c7e2d3; --color-5: #f6e7d2. 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