← Back to Editor

#78776C · #B8B291 · #E6C3D1 · #F2E6EB · #E0DDC3

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#78776C

Ink Gray · DimGray · Warm Gray

HEX
#78776C
RGB
rgb(120, 119, 108)
HSL
hsl(55, 5%, 45%)
HSB
hsb(55, 10%, 47%)
CMYK
cmyk(0%, 1%, 10%, 53%)
Oklch
oklch(56.7% 0.017 102.7)

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

#B8B291

Fresh Green · Tan · Sunflower

HEX
#B8B291
RGB
rgb(184, 178, 145)
HSL
hsl(51, 22%, 65%)
HSB
hsb(51, 21%, 72%)
CMYK
cmyk(0%, 3%, 21%, 28%)
Oklch
oklch(76.0% 0.046 98.8)

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

#E6C3D1

Rouge · LightGray · Cherry Blossom

HEX
#E6C3D1
RGB
rgb(230, 195, 209)
HSL
hsl(336, 41%, 83%)
HSB
hsb(336, 15%, 90%)
CMYK
cmyk(0%, 15%, 9%, 10%)
Oklch
oklch(85.1% 0.044 352.0)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#F2E6EB

Rouge · Linen · Cherry Blossom

HEX
#F2E6EB
RGB
rgb(242, 230, 235)
HSL
hsl(335, 32%, 93%)
HSB
hsb(335, 5%, 95%)
CMYK
cmyk(0%, 5%, 3%, 5%)
Oklch
oklch(93.6% 0.015 350.1)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#E0DDC3

Fresh Green · LightGray · Lemon Cream

HEX
#E0DDC3
RGB
rgb(224, 221, 195)
HSL
hsl(54, 32%, 82%)
HSB
hsb(54, 13%, 88%)
CMYK
cmyk(0%, 1%, 13%, 12%)
Oklch
oklch(89.3% 0.035 101.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

78776C
6D6E78

Analogous

78726D
78776C
74786D

Triadic

78776C
6D7878
786D78

Split-Comp.

78776C
6D7478
726D78

Tetradic

78776C
6D7872
6D6E78
786D74

Contrast Matrix WCAG 2.1 Contrast

78776C
B8B291
E6C3D1
F2E6EB
E0DDC3
—
2.1
Fail
2.8
Fail
3.7
AA Large
3.3
AA Large
2.1
Fail
—
1.3
Fail
1.8
Fail
1.6
Fail
2.8
Fail
1.3
Fail
—
1.3
Fail
1.2
Fail
3.7
AA Large
1.8
Fail
1.3
Fail
—
1.1
Fail
3.3
AA Large
1.6
Fail
1.2
Fail
1.1
Fail
—
White BG
4.5AA
2.1Fail
1.6Fail
1.2Fail
1.4Fail
Black BG
4.7AA
9.8AAA
13.1AAA
17.3AAA
15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

78786F
B5B599
D7D7CE
EDEDEA
DFDFC9

Deuteranopia

78786F
B6B69B
D9DCCD
EEEEEA
DFDFCB

Tritanopia

787171
B89FA1
E4CBCA
F1E9E9
E0CECF

Achromatopsia

767676
B0B0B0
CFCFCF
EAEAEA
DBDBDB

Shades & Tints Shades & Tints

#78776C

Dark
Light

#B8B291

Dark
Light

#E6C3D1

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #78776c;
  --color-2: #b8b291;
  --color-3: #e6c3d1;
  --color-4: #f2e6eb;
  --color-5: #e0ddc3;
}

SCSS

$color-1: #78776c;
$color-2: #b8b291;
$color-3: #e6c3d1;
$color-4: #f2e6eb;
$color-5: #e0ddc3;

TAILWIND

colors: {
  'brand-1': '#78776c',
  'brand-2': '#b8b291',
  'brand-3': '#e6c3d1',
  'brand-4': '#f2e6eb',
  'brand-5': '#e0ddc3',
}

RGB Array

[120, 119, 108], [184, 178, 145], [230, 195, 209], [242, 230, 235], [224, 221, 195]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #78776C, #B8B291, #E6C3D1, #F2E6EB, #E0DDC3 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #78776c; --color-2: #b8b291; --color-3: #e6c3d1; --color-4: #f2e6eb; --color-5: #e0ddc3. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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