#E7C48B + #D97E83 + #CD6583 + #97637D + #968C9F - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#E7C48B

Goose Yellow · BurlyWood · Warm Sun

HEX

#E7C48B

RGB

rgb(231, 196, 139)

HSL

hsl(37, 66%, 73%)

HSB

hsb(37, 40%, 91%)

CMYK

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

Oklch

oklch(83.7% 0.084 79.4)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#D97E83

Peach Pink · LightCoral · Coral Red

HEX

#D97E83

RGB

rgb(217, 126, 131)

HSL

hsl(357, 54%, 67%)

HSB

hsb(357, 42%, 85%)

CMYK

cmyk(0%, 42%, 40%, 15%)

Oklch

oklch(69.3% 0.113 16.9)

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

#CD6583

Dark Violet · LightCoral · Rose Pink

HEX

#CD6583

RGB

rgb(205, 101, 131)

HSL

hsl(343, 51%, 60%)

HSB

hsb(343, 51%, 80%)

CMYK

cmyk(0%, 51%, 36%, 20%)

Oklch

oklch(63.8% 0.135 3.4)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#97637D

Dark Violet · Gray · Camellia

HEX

#97637D

RGB

rgb(151, 99, 125)

HSL

hsl(330, 21%, 49%)

HSB

hsb(330, 34%, 59%)

CMYK

cmyk(0%, 34%, 17%, 41%)

Oklch

oklch(56.4% 0.076 348.4)

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

#968C9F

Dark Plum · LightSlateGray · Silver Sand

HEX

#968C9F

RGB

rgb(150, 140, 159)

HSL

hsl(272, 9%, 59%)

HSB

hsb(272, 12%, 62%)

CMYK

cmyk(6%, 12%, 0%, 38%)

Oklch

oklch(65.5% 0.030 309.0)

Traditional「Dark Plum」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E7C48B

8DB0E8

Analogous

E8978D

E7C48B

DDE88D

Triadic

E7C48B

8DE8C5

C58DE8

Split-Comp.

E7C48B

8DDDE8

978DE8

Tetradic

E7C48B

8DE897

8DB0E8

E88DDD

Contrast Matrix WCAG 2.1 Contrast

E7C48B	D97E83	CD6583	97637D	968C9F
—	1.7 Fail	2.2 Fail	2.9 Fail	1.9 Fail
1.7 Fail	—	1.3 Fail	1.7 Fail	1.1 Fail
2.2 Fail	1.3 Fail	—	1.3 Fail	1.1 Fail
2.9 Fail	1.7 Fail	1.3 Fail	—	1.5 Fail
1.9 Fail	1.1 Fail	1.1 Fail	1.5 Fail	—

White BG

1.7Fail

2.9Fail

3.6AA Large

4.8AA

3.2AA Large

Black BG

12.7AAA

7.3AAA

5.8AA

4.4AA Large

6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D8D899

B2B182

A09F7C

808077

92929A

Deuteranopia

DADD9C

B7BE82

A6AE7A

848775

929399

Tritanopia

E5A4A6

D48181

C87675

947271

969796

Achromatopsia

C8C8C8

9A9A9A

888888

767676

919191

Shades & Tints Shades & Tints

#E7C48B

Dark

Light

#D97E83

Dark

Light

#CD6583

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e7c48b;
  --color-2: #d97e83;
  --color-3: #cd6583;
  --color-4: #97637d;
  --color-5: #968c9f;
}

SCSS

$color-1: #e7c48b;
$color-2: #d97e83;
$color-3: #cd6583;
$color-4: #97637d;
$color-5: #968c9f;

TAILWIND

colors: {
  'brand-1': '#e7c48b',
  'brand-2': '#d97e83',
  'brand-3': '#cd6583',
  'brand-4': '#97637d',
  'brand-5': '#968c9f',
}

RGB Array

[231, 196, 139], [217, 126, 131], [205, 101, 131], [151, 99, 125], [150, 140, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E7C48B, #D97E83, #CD6583, #97637D, #968C9F is ideal for: corporate websites, product showcases, portfolios. 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: #e7c48b; --color-2: #d97e83; --color-3: #cd6583; --color-4: #97637d; --color-5: #968c9f. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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