#E48072 + #C4AF8D + #A9D6A3 + #D7E4A0 + #C6DD50 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E48072

Peach Pink · LightCoral · Coral Red

HEX

#E48072

RGB

rgb(228, 128, 114)

HSL

hsl(7, 68%, 67%)

HSB

hsb(7, 50%, 89%)

CMYK

cmyk(0%, 44%, 50%, 11%)

Oklch

oklch(70.6% 0.126 29.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#C4AF8D

Ginger · Tan · Warm Sun

HEX

#C4AF8D

RGB

rgb(196, 175, 141)

HSL

hsl(37, 32%, 66%)

HSB

hsb(37, 28%, 77%)

CMYK

cmyk(0%, 11%, 28%, 23%)

Oklch

oklch(76.3% 0.052 79.7)

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

#A9D6A3

Celadon · LightGreen · Apple Green

HEX

#A9D6A3

RGB

rgb(169, 214, 163)

HSL

hsl(113, 38%, 74%)

HSB

hsb(113, 24%, 84%)

CMYK

cmyk(21%, 0%, 24%, 16%)

Oklch

oklch(83.1% 0.084 141.7)

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

#D7E4A0

Willow Green · Khaki · Apple Green

HEX

#D7E4A0

RGB

rgb(215, 228, 160)

HSL

hsl(71, 56%, 76%)

HSB

hsb(71, 30%, 89%)

CMYK

cmyk(6%, 0%, 30%, 11%)

Oklch

oklch(89.3% 0.089 117.0)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#C6DD50

Grass Green · GreenYellow · Olive Green

HEX

#C6DD50

RGB

rgb(198, 221, 80)

HSL

hsl(70, 67%, 59%)

HSB

hsb(70, 64%, 87%)

CMYK

cmyk(10%, 0%, 64%, 13%)

Oklch

oklch(85.4% 0.165 118.0)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E48072

72D7E4

Analogous

E4729D

E48072

E4B872

Triadic

E48072

72E47F

7F72E4

Split-Comp.

E48072

72E4B8

729DE4

Tetradic

E48072

9DE472

72D7E4

B872E4

Contrast Matrix WCAG 2.1 Contrast

E48072	C4AF8D	A9D6A3	D7E4A0	C6DD50
—	1.3 Fail	1.7 Fail	2.0 Fail	1.8 Fail
1.3 Fail	—	1.3 Fail	1.6 Fail	1.4 Fail
1.7 Fail	1.3 Fail	—	1.2 Fail	1.1 Fail
2.0 Fail	1.6 Fail	1.2 Fail	—	1.1 Fail
1.8 Fail	1.4 Fail	1.1 Fail	1.1 Fail	—

White BG

2.8Fail

2.1Fail

1.6Fail

1.4Fail

1.5Fail

Black BG

7.6AAA

9.9AAA

12.8AAA

15.5AAA

13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B875

BBBB95

BCBDAF

DDDDB0

D0D072

Deuteranopia

BFC676

BCBE97

BAB7B2

DCDBB4

CFCD7A

Tritanopia

DF7879

C39C9D

ABB9BB

D8BDC0

C78D93

Achromatopsia

9C9C9C

B1B1B1

C3C3C3

D8D8D8

C6C6C6

Shades & Tints Shades & Tints

#E48072

Dark

Light

#C4AF8D

Dark

Light

#A9D6A3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e48072;
  --color-2: #c4af8d;
  --color-3: #a9d6a3;
  --color-4: #d7e4a0;
  --color-5: #c6dd50;
}

SCSS

$color-1: #e48072;
$color-2: #c4af8d;
$color-3: #a9d6a3;
$color-4: #d7e4a0;
$color-5: #c6dd50;

TAILWIND

colors: {
  'brand-1': '#e48072',
  'brand-2': '#c4af8d',
  'brand-3': '#a9d6a3',
  'brand-4': '#d7e4a0',
  'brand-5': '#c6dd50',
}

RGB Array

[228, 128, 114], [196, 175, 141], [169, 214, 163], [215, 228, 160], [198, 221, 80]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E48072, #C4AF8D, #A9D6A3, #D7E4A0, #C6DD50 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: #e48072; --color-2: #c4af8d; --color-3: #a9d6a3; --color-4: #d7e4a0; --color-5: #c6dd50. 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