#7D7169 + #EBC2AC + #E5DABA + #A8C8B1 + #9ABAB4 · summer - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#7D7169

Tangerine · DimGray · Warm Gray

HEX

#7D7169

RGB

rgb(125, 113, 105)

HSL

hsl(24, 9%, 45%)

HSB

hsb(24, 16%, 49%)

CMYK

cmyk(0%, 10%, 16%, 51%)

Oklch

oklch(55.7% 0.019 56.0)

Traditional「Tangerine」· Paint「Warm Gray」· Creative Urban Concrete

#EBC2AC

Apricot · Wheat · Peach Orange

HEX

#EBC2AC

RGB

rgb(235, 194, 172)

HSL

hsl(21, 61%, 80%)

HSB

hsb(21, 27%, 92%)

CMYK

cmyk(0%, 17%, 27%, 8%)

Oklch

oklch(84.4% 0.056 49.8)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E5DABA

Goose Yellow · Wheat · Lemon Cream

HEX

#E5DABA

RGB

rgb(229, 218, 186)

HSL

hsl(45, 45%, 81%)

HSB

hsb(45, 19%, 90%)

CMYK

cmyk(0%, 5%, 19%, 10%)

Oklch

oklch(88.9% 0.044 91.3)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#A8C8B1

Celadon · Silver · Apple Green

HEX

#A8C8B1

RGB

rgb(168, 200, 177)

HSL

hsl(137, 23%, 72%)

HSB

hsb(137, 16%, 78%)

CMYK

cmyk(16%, 0%, 12%, 22%)

Oklch

oklch(80.3% 0.047 154.0)

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

#9ABAB4

Jade · DarkGray · Lake Green

HEX

#9ABAB4

RGB

rgb(154, 186, 180)

HSL

hsl(169, 19%, 67%)

HSB

hsb(169, 17%, 73%)

CMYK

cmyk(17%, 0%, 3%, 27%)

Oklch

oklch(76.3% 0.036 182.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7D7169

68757D

Analogous

7D686A

7D7169

7D7B68

Triadic

7D7169

687D71

71687D

Split-Comp.

7D7169

687D7B

686A7D

Tetradic

7D7169

6A7D68

68757D

7B687D

Contrast Matrix WCAG 2.1 Contrast

7D7169	EBC2AC	E5DABA	A8C8B1	9ABAB4
—	2.9 Fail	3.4 AA Large	2.6 Fail	2.3 Fail
2.9 Fail	—	1.2 Fail	1.1 Fail	1.3 Fail
3.4 AA Large	1.2 Fail	—	1.3 Fail	1.5 Fail
2.6 Fail	1.1 Fail	1.3 Fail	—	1.1 Fail
2.3 Fail	1.3 Fail	1.5 Fail	1.1 Fail	—

White BG

4.7AA

1.6Fail

1.4Fail

1.8Fail

2.1Fail

Black BG

4.4AA Large

12.8AAA

15.1AAA

11.6AAA

10.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

78786B

D9D9B1

E0E0C2

B6B6B7

A8A8B5

Deuteranopia

79796B

DCDFB3

E1E2C4

B4B2B8

A6A4B6

Tritanopia

7C6C6D

E9B6B6

E4C8C9

AABBBC

9CB7B7

Achromatopsia

747474

CCCCCC

DADADA

BCBCBC

B0B0B0

Shades & Tints Shades & Tints

#7D7169

Dark

Light

#EBC2AC

Dark

Light

#E5DABA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7d7169;
  --color-2: #ebc2ac;
  --color-3: #e5daba;
  --color-4: #a8c8b1;
  --color-5: #9abab4;
}

SCSS

$color-1: #7d7169;
$color-2: #ebc2ac;
$color-3: #e5daba;
$color-4: #a8c8b1;
$color-5: #9abab4;

TAILWIND

colors: {
  'brand-1': '#7d7169',
  'brand-2': '#ebc2ac',
  'brand-3': '#e5daba',
  'brand-4': '#a8c8b1',
  'brand-5': '#9abab4',
}

RGB Array

[125, 113, 105], [235, 194, 172], [229, 218, 186], [168, 200, 177], [154, 186, 180]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This summer-style palette of #7D7169, #EBC2AC, #E5DABA, #A8C8B1, #9ABAB4 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: #7d7169; --color-2: #ebc2ac; --color-3: #e5daba; --color-4: #a8c8b1; --color-5: #9abab4. 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