← Back to Editor

#8F9296 · #98ABA8 · #C7C1AB · #E7D3C2 · #EDE1D5

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8F9296

Ash · LightSlateGray · Silver Sand

HEX
#8F9296
RGB
rgb(143, 146, 150)
HSL
hsl(214, 3%, 57%)
HSB
hsb(214, 5%, 59%)
CMYK
cmyk(5%, 3%, 0%, 41%)
Oklch
oklch(65.9% 0.007 255.5)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#98ABA8

Jade · DarkGray · Lake Green

HEX
#98ABA8
RGB
rgb(152, 171, 168)
HSL
hsl(171, 10%, 63%)
HSB
hsb(171, 11%, 67%)
CMYK
cmyk(11%, 0%, 2%, 33%)
Oklch
oklch(72.6% 0.022 185.3)

TraditionalJade」· PaintLake Green」· Creative Arctic Pool

#C7C1AB

Goose Yellow · Silver · Sunflower

HEX
#C7C1AB
RGB
rgb(199, 193, 171)
HSL
hsl(47, 20%, 73%)
HSB
hsb(47, 14%, 78%)
CMYK
cmyk(0%, 3%, 14%, 22%)
Oklch
oklch(81.0% 0.031 94.4)

TraditionalGoose Yellow」· PaintSunflower」· Creative Lemon Fizz

#E7D3C2

Apricot · Wheat · Peach Orange

HEX
#E7D3C2
RGB
rgb(231, 211, 194)
HSL
hsl(28, 44%, 83%)
HSB
hsb(28, 16%, 91%)
CMYK
cmyk(0%, 9%, 16%, 9%)
Oklch
oklch(87.9% 0.032 62.8)

TraditionalApricot」· PaintPeach Orange」· Creative Honey Glow

#EDE1D5

Goose Yellow · Beige · Peach Orange

HEX
#EDE1D5
RGB
rgb(237, 225, 213)
HSL
hsl(30, 40%, 88%)
HSB
hsb(30, 10%, 93%)
CMYK
cmyk(0%, 5%, 10%, 7%)
Oklch
oklch(91.6% 0.021 67.6)

TraditionalGoose Yellow」· PaintPeach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F9296
95928E

Analogous

8E9495
8F9296
8E8E95

Triadic

8F9296
958E91
91958E

Split-Comp.

8F9296
958E8E
94958E

Tetradic

8F9296
958E94
95928E
8E958E

Contrast Matrix WCAG 2.1 Contrast

8F9296
98ABA8
C7C1AB
E7D3C2
EDE1D5
1.3
Fail
1.7
Fail
2.2
Fail
2.4
Fail
1.3
Fail
1.3
Fail
1.7
Fail
1.9
Fail
1.7
Fail
1.3
Fail
1.2
Fail
1.4
Fail
2.2
Fail
1.7
Fail
1.2
Fail
1.1
Fail
2.4
Fail
1.9
Fail
1.4
Fail
1.1
Fail
White BG
3.1AA Large
2.4Fail
1.8Fail
1.4Fail
1.3Fail
Black BG
6.7AA
8.7AAA
11.6AAA
14.5AAA
16.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

909095
A0A0A9
C4C4B0
DEDEC6
E8E8D8

Deuteranopia

909095
9F9EA9
C5C5B2
E0E1C7
E9E9D9

Tritanopia

8F9494
99A9A9
C7B5B5
E6C9CA
ECDADB

Achromatopsia

929292
A5A5A5
C0C0C0
D7D7D7
E3E3E3

Shades & Tints Shades & Tints

#8F9296

Dark
Light

#98ABA8

Dark
Light

#C7C1AB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f9296;
  --color-2: #98aba8;
  --color-3: #c7c1ab;
  --color-4: #e7d3c2;
  --color-5: #ede1d5;
}

SCSS

$color-1: #8f9296;
$color-2: #98aba8;
$color-3: #c7c1ab;
$color-4: #e7d3c2;
$color-5: #ede1d5;

TAILWIND

colors: {
  'brand-1': '#8f9296',
  'brand-2': '#98aba8',
  'brand-3': '#c7c1ab',
  'brand-4': '#e7d3c2',
  'brand-5': '#ede1d5',
}

RGB Array

[143, 146, 150], [152, 171, 168], [199, 193, 171], [231, 211, 194], [237, 225, 213]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8F9296, #98ABA8, #C7C1AB, #E7D3C2, #EDE1D5 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. 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: #8f9296; --color-2: #98aba8; --color-3: #c7c1ab; --color-4: #e7d3c2; --color-5: #ede1d5. 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 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