#82747E + #74B8A0 + #CFD69C + #EDE3BE + #E0D0B8 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#82747E

Ink Gray · Gray · Warm Gray

HEX

#82747E

RGB

rgb(130, 116, 126)

HSL

hsl(317, 6%, 48%)

HSB

hsb(317, 11%, 51%)

CMYK

cmyk(0%, 11%, 3%, 49%)

Oklch

oklch(57.5% 0.023 336.0)

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

#74B8A0

Mineral Blue · MediumAquaMarine · Olive Green

HEX

#74B8A0

RGB

rgb(116, 184, 160)

HSL

hsl(159, 32%, 59%)

HSB

hsb(159, 37%, 72%)

CMYK

cmyk(37%, 0%, 13%, 28%)

Oklch

oklch(73.0% 0.078 169.7)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#CFD69C

Fresh Green · Tan · Sunflower

HEX

#CFD69C

RGB

rgb(207, 214, 156)

HSL

hsl(67, 41%, 73%)

HSB

hsb(67, 27%, 84%)

CMYK

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

Oklch

oklch(85.7% 0.077 113.6)

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

#EDE3BE

Goose Yellow · Wheat · Lemon Cream

HEX

#EDE3BE

RGB

rgb(237, 227, 190)

HSL

hsl(47, 57%, 84%)

HSB

hsb(47, 20%, 93%)

CMYK

cmyk(0%, 4%, 20%, 7%)

Oklch

oklch(91.4% 0.050 94.6)

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

#E0D0B8

Goose Yellow · Wheat · Peach Orange

HEX

#E0D0B8

RGB

rgb(224, 208, 184)

HSL

hsl(36, 39%, 80%)

HSB

hsb(36, 18%, 88%)

CMYK

cmyk(0%, 7%, 18%, 12%)

Oklch

oklch(86.4% 0.037 78.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

82747E

738277

Analogous

7F7382

82747E

827376

Triadic

82747E

7E8273

737E82

Split-Comp.

82747E

768273

73827F

Tetradic

82747E

827F73

738277

737682

Contrast Matrix WCAG 2.1 Contrast

82747E	74B8A0	CFD69C	EDE3BE	E0D0B8
—	1.9 Fail	2.9 Fail	3.4 AA Large	2.9 Fail
1.9 Fail	—	1.5 Fail	1.8 Fail	1.5 Fail
2.9 Fail	1.5 Fail	—	1.2 Fail	1.0 Fail
3.4 AA Large	1.8 Fail	1.2 Fail	—	1.2 Fail
2.9 Fail	1.5 Fail	1.0 Fail	1.2 Fail	—

White BG

4.4AA Large

2.3Fail

1.5Fail

1.3Fail

1.5Fail

Black BG

4.7AA

9.1AAA

13.8AAA

16.3AAA

13.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7C7C

9192A6

D2D2AA

E9E9C7

D9D9BE

Deuteranopia

7D7E7B

8E88A7

D2D1AD

E9EAC9

DADBBF

Tritanopia

817A79

77AAAB

CFB5B8

ECCED0

DFC2C3

Achromatopsia

797979

A1A1A1

CDCDCD

E2E2E2

D2D2D2

Shades & Tints Shades & Tints

#82747E

Dark

Light

#74B8A0

Dark

Light

#CFD69C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #82747e;
  --color-2: #74b8a0;
  --color-3: #cfd69c;
  --color-4: #ede3be;
  --color-5: #e0d0b8;
}

SCSS

$color-1: #82747e;
$color-2: #74b8a0;
$color-3: #cfd69c;
$color-4: #ede3be;
$color-5: #e0d0b8;

TAILWIND

colors: {
  'brand-1': '#82747e',
  'brand-2': '#74b8a0',
  'brand-3': '#cfd69c',
  'brand-4': '#ede3be',
  'brand-5': '#e0d0b8',
}

RGB Array

[130, 116, 126], [116, 184, 160], [207, 214, 156], [237, 227, 190], [224, 208, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #82747E, #74B8A0, #CFD69C, #EDE3BE, #E0D0B8 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: #82747e; --color-2: #74b8a0; --color-3: #cfd69c; --color-4: #ede3be; --color-5: #e0d0b8. 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