#E7E495 + #EED4A4 + #F1AFBC + #B3A4B4 + #4398AE - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E7E495

Fresh Green · Khaki · Sunflower

HEX

#E7E495

RGB

rgb(231, 228, 149)

HSL

hsl(58, 63%, 75%)

HSB

hsb(58, 35%, 91%)

CMYK

cmyk(0%, 1%, 35%, 9%)

Oklch

oklch(90.3% 0.100 106.4)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#EED4A4

Goose Yellow · Wheat · Peach Orange

HEX

#EED4A4

RGB

rgb(238, 212, 164)

HSL

hsl(39, 69%, 79%)

HSB

hsb(39, 31%, 93%)

CMYK

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

Oklch

oklch(88.0% 0.069 82.7)

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

#F1AFBC

Peach Pink · LightPink · Cherry Blossom

HEX

#F1AFBC

RGB

rgb(241, 175, 188)

HSL

hsl(348, 70%, 82%)

HSB

hsb(348, 27%, 95%)

CMYK

cmyk(0%, 27%, 22%, 5%)

Oklch

oklch(81.9% 0.079 5.9)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#B3A4B4

Lilac · DarkGray · Lilac Purple

HEX

#B3A4B4

RGB

rgb(179, 164, 180)

HSL

hsl(296, 10%, 67%)

HSB

hsb(296, 9%, 71%)

CMYK

cmyk(1%, 9%, 0%, 29%)

Oklch

oklch(73.6% 0.028 324.0)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#4398AE

Slate Blue · SteelBlue · Mint Ice

HEX

#4398AE

RGB

rgb(67, 152, 174)

HSL

hsl(192, 44%, 47%)

HSB

hsb(192, 61%, 68%)

CMYK

cmyk(61%, 13%, 0%, 32%)

Oklch

oklch(63.6% 0.087 217.5)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E7E495

979AE7

Analogous

E7BD97

E7E495

C2E797

Triadic

E7E495

97E7E5

E597E7

Split-Comp.

E7E495

97C2E7

BD97E7

Tetradic

E7E495

97E7BD

979AE7

E797C2

Contrast Matrix WCAG 2.1 Contrast

E7E495	EED4A4	F1AFBC	B3A4B4	4398AE
—	1.1 Fail	1.4 Fail	1.8 Fail	2.5 Fail
1.1 Fail	—	1.3 Fail	1.6 Fail	2.3 Fail
1.4 Fail	1.3 Fail	—	1.3 Fail	1.8 Fail
1.8 Fail	1.6 Fail	1.3 Fail	—	1.4 Fail
2.5 Fail	2.3 Fail	1.8 Fail	1.4 Fail	—

White BG

1.3Fail

1.4Fail

1.8Fail

2.4Fail

3.3AA Large

Black BG

15.9AAA

14.6AAA

11.6AAA

8.9AAA

6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E6A8

E3E3B0

D4D4B9

ADACB0

6869A9

Deuteranopia

E6E6AD

E4E6B2

D8DDB8

ADAFAF

635DA7

Tritanopia

E7B7BB

EDB9BB

EEB6B6

B2ADAC

47A4A4

Achromatopsia

DCDCDC

D6D6D6

C4C4C4

AAAAAA

818181

Shades & Tints Shades & Tints

#E7E495

Dark

Light

#EED4A4

Dark

Light

#F1AFBC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e7e495;
  --color-2: #eed4a4;
  --color-3: #f1afbc;
  --color-4: #b3a4b4;
  --color-5: #4398ae;
}

SCSS

$color-1: #e7e495;
$color-2: #eed4a4;
$color-3: #f1afbc;
$color-4: #b3a4b4;
$color-5: #4398ae;

TAILWIND

colors: {
  'brand-1': '#e7e495',
  'brand-2': '#eed4a4',
  'brand-3': '#f1afbc',
  'brand-4': '#b3a4b4',
  'brand-5': '#4398ae',
}

RGB Array

[231, 228, 149], [238, 212, 164], [241, 175, 188], [179, 164, 180], [67, 152, 174]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E7E495, #EED4A4, #F1AFBC, #B3A4B4, #4398AE 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: #e7e495; --color-2: #eed4a4; --color-3: #f1afbc; --color-4: #b3a4b4; --color-5: #4398ae. 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