#E1DDB7 + #95C4B4 + #B78191 + #F7A190 + #FFD69D · summer - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E1DDB7

Fresh Green · Wheat · Lemon Cream

HEX

#E1DDB7

RGB

rgb(225, 221, 183)

HSL

hsl(54, 41%, 80%)

HSB

hsb(54, 19%, 88%)

CMYK

cmyk(0%, 2%, 19%, 12%)

Oklch

oklch(89.1% 0.050 102.4)

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

#95C4B4

Jade · DarkGray · Lake Green

HEX

#95C4B4

RGB

rgb(149, 196, 180)

HSL

hsl(160, 28%, 68%)

HSB

hsb(160, 24%, 77%)

CMYK

cmyk(24%, 0%, 8%, 23%)

Oklch

oklch(78.2% 0.055 171.9)

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

#B78191

Rouge · DarkGray · Rose Pink

HEX

#B78191

RGB

rgb(183, 129, 145)

HSL

hsl(342, 27%, 61%)

HSB

hsb(342, 30%, 72%)

CMYK

cmyk(0%, 30%, 21%, 28%)

Oklch

oklch(66.2% 0.070 359.8)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#F7A190

Peach Pink · LightSalmon · Coral Red

HEX

#F7A190

RGB

rgb(247, 161, 144)

HSL

hsl(10, 87%, 77%)

HSB

hsb(10, 42%, 97%)

CMYK

cmyk(0%, 35%, 42%, 3%)

Oklch

oklch(79.0% 0.106 31.7)

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

#FFD69D

Goose Yellow · Wheat · Peach Orange

HEX

#FFD69D

RGB

rgb(255, 214, 157)

HSL

hsl(35, 100%, 81%)

HSB

hsb(35, 38%, 100%)

CMYK

cmyk(0%, 16%, 38%, 0%)

Oklch

oklch(89.8% 0.086 75.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1DDB7

B7BBE1

Analogous

E1C8B7

E1DDB7

D0E1B7

Triadic

E1DDB7

B7E1DD

DDB7E1

Split-Comp.

E1DDB7

B7D0E1

C8B7E1

Tetradic

E1DDB7

B7E1C8

B7BBE1

E1B7D0

Contrast Matrix WCAG 2.1 Contrast

E1DDB7	95C4B4	B78191	F7A190	FFD69D
—	1.4 Fail	2.3 Fail	1.5 Fail	1.0 Fail
1.4 Fail	—	1.7 Fail	1.0 Fail	1.4 Fail
2.3 Fail	1.7 Fail	—	1.6 Fail	2.3 Fail
1.5 Fail	1.0 Fail	1.6 Fail	—	1.5 Fail
1.0 Fail	1.4 Fail	2.3 Fail	1.5 Fail	—

White BG

1.4Fail

1.9Fail

3.2AA Large

2.0Fail

1.4Fail

Black BG

15.2AAA

10.8AAA

6.6AA

10.5AAA

15.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDFC0

A9AAB8

A09F8D

D2D194

EDEDAB

Deuteranopia

E0E0C2

A7A3B9

A3A78C

D7DD95

F0F3AE

Tritanopia

E1C7C9

97BBBC

B48A89

F39798

FDB6B8

Achromatopsia

DADADA

B4B4B4

939393

B9B9B9

DCDCDC

Shades & Tints Shades & Tints

#E1DDB7

Dark

Light

#95C4B4

Dark

Light

#B78191

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1ddb7;
  --color-2: #95c4b4;
  --color-3: #b78191;
  --color-4: #f7a190;
  --color-5: #ffd69d;
}

SCSS

$color-1: #e1ddb7;
$color-2: #95c4b4;
$color-3: #b78191;
$color-4: #f7a190;
$color-5: #ffd69d;

TAILWIND

colors: {
  'brand-1': '#e1ddb7',
  'brand-2': '#95c4b4',
  'brand-3': '#b78191',
  'brand-4': '#f7a190',
  'brand-5': '#ffd69d',
}

RGB Array

[225, 221, 183], [149, 196, 180], [183, 129, 145], [247, 161, 144], [255, 214, 157]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This summer-style palette of #E1DDB7, #95C4B4, #B78191, #F7A190, #FFD69D 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: #e1ddb7; --color-2: #95c4b4; --color-3: #b78191; --color-4: #f7a190; --color-5: #ffd69d. 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 summer-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