#7C6669 + #9A8E82 + #F8E0B2 + #EAC38A + #B0C395 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#7C6669

Crimson · DimGray · Passion Red

HEX

#7C6669

RGB

rgb(124, 102, 105)

HSL

hsl(352, 10%, 44%)

HSB

hsb(352, 18%, 49%)

CMYK

cmyk(0%, 18%, 15%, 51%)

Oklch

oklch(53.3% 0.029 8.8)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#9A8E82

Ginger · Gray · Warm Sun

HEX

#9A8E82

RGB

rgb(154, 142, 130)

HSL

hsl(30, 11%, 56%)

HSB

hsb(30, 16%, 60%)

CMYK

cmyk(0%, 8%, 16%, 40%)

Oklch

oklch(65.4% 0.023 67.4)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#F8E0B2

Goose Yellow · Wheat · Peach Orange

HEX

#F8E0B2

RGB

rgb(248, 224, 178)

HSL

hsl(39, 83%, 84%)

HSB

hsb(39, 28%, 97%)

CMYK

cmyk(0%, 10%, 28%, 3%)

Oklch

oklch(91.5% 0.065 83.5)

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

#EAC38A

Goose Yellow · BurlyWood · Warm Sun

HEX

#EAC38A

RGB

rgb(234, 195, 138)

HSL

hsl(36, 70%, 73%)

HSB

hsb(36, 41%, 92%)

CMYK

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

Oklch

oklch(83.8% 0.086 76.6)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#B0C395

Willow Green · DarkGray · Apple Green

HEX

#B0C395

RGB

rgb(176, 195, 149)

HSL

hsl(85, 28%, 67%)

HSB

hsb(85, 24%, 76%)

CMYK

cmyk(10%, 0%, 24%, 24%)

Oklch

oklch(79.1% 0.066 126.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7C6669

657B78

Analogous

7B6573

7C6669

7B6D65

Triadic

7C6669

687B65

65687B

Split-Comp.

7C6669

657B6D

65737B

Tetradic

7C6669

737B65

657B78

6D657B

Contrast Matrix WCAG 2.1 Contrast

7C6669	9A8E82	F8E0B2	EAC38A	B0C395
—	1.7 Fail	4.1 AA Large	3.2 AA Large	2.8 Fail
1.7 Fail	—	2.5 Fail	1.9 Fail	1.7 Fail
4.1 AA Large	2.5 Fail	—	1.3 Fail	1.5 Fail
3.2 AA Large	1.9 Fail	1.3 Fail	—	1.1 Fail
2.8 Fail	1.7 Fail	1.5 Fail	1.1 Fail	—

White BG

5.3AA

3.2AA Large

1.3Fail

1.7Fail

1.9Fail

Black BG

4.0AA Large

6.6AA

16.3AAA

12.7AAA

11.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

727268

959585

EEEDBD

D9D998

B8B8A0

Deuteranopia

747568

969686

EFF1C0

DBDE9B

B7B6A3

Tritanopia

7B6868

998788

F7C6C8

E8A3A5

B1A9AB

Achromatopsia

6D6D6D

909090

E2E2E2

C8C8C8

B8B8B8

Shades & Tints Shades & Tints

#7C6669

Dark

Light

#9A8E82

Dark

Light

#F8E0B2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7c6669;
  --color-2: #9a8e82;
  --color-3: #f8e0b2;
  --color-4: #eac38a;
  --color-5: #b0c395;
}

SCSS

$color-1: #7c6669;
$color-2: #9a8e82;
$color-3: #f8e0b2;
$color-4: #eac38a;
$color-5: #b0c395;

TAILWIND

colors: {
  'brand-1': '#7c6669',
  'brand-2': '#9a8e82',
  'brand-3': '#f8e0b2',
  'brand-4': '#eac38a',
  'brand-5': '#b0c395',
}

RGB Array

[124, 102, 105], [154, 142, 130], [248, 224, 178], [234, 195, 138], [176, 195, 149]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7C6669, #9A8E82, #F8E0B2, #EAC38A, #B0C395 is ideal for: corporate websites, product showcases, portfolios. 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: #7c6669; --color-2: #9a8e82; --color-3: #f8e0b2; --color-4: #eac38a; --color-5: #b0c395. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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