← Back to Editor

#8F8675 · #F1E2C1 · #C6BBA7 · #AEA28C · #26324A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#8F8675

Ginger · Gray · Warm Sun

HEX
#8F8675
RGB
rgb(143, 134, 117)
HSL
hsl(39, 10%, 51%)
HSB
hsb(39, 18%, 56%)
CMYK
cmyk(0%, 6%, 18%, 44%)
Oklch
oklch(62.3% 0.027 83.4)

TraditionalGinger」· PaintWarm Sun」· Creative Blush Sunrise

#F1E2C1

Goose Yellow · Bisque · Lemon Cream

HEX
#F1E2C1
RGB
rgb(241, 226, 193)
HSL
hsl(41, 63%, 85%)
HSB
hsb(41, 20%, 95%)
CMYK
cmyk(0%, 6%, 20%, 5%)
Oklch
oklch(91.6% 0.046 86.5)

TraditionalGoose Yellow」· PaintLemon Cream」· Creative Lemon Fizz

#C6BBA7

Goose Yellow · Silver · Warm Sun

HEX
#C6BBA7
RGB
rgb(198, 187, 167)
HSL
hsl(39, 21%, 72%)
HSB
hsb(39, 16%, 78%)
CMYK
cmyk(0%, 6%, 16%, 22%)
Oklch
oklch(79.6% 0.030 82.6)

TraditionalGoose Yellow」· PaintWarm Sun」· Creative Honey Glow

#AEA28C

Ginger · DarkGray · Warm Sun

HEX
#AEA28C
RGB
rgb(174, 162, 140)
HSL
hsl(39, 17%, 62%)
HSB
hsb(39, 20%, 68%)
CMYK
cmyk(0%, 7%, 20%, 32%)
Oklch
oklch(71.6% 0.034 82.7)

TraditionalGinger」· PaintWarm Sun」· Creative Honey Glow

#26324A

Indigo · DarkSlateGray · Prussian Blue

HEX
#26324A
RGB
rgb(38, 50, 74)
HSL
hsl(220, 32%, 22%)
HSB
hsb(220, 49%, 29%)
CMYK
cmyk(49%, 32%, 0%, 71%)
Oklch
oklch(31.8% 0.046 263.6)

TraditionalIndigo」· PaintPrussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F8675
767E8F

Analogous

8F7976
8F8675
8B8F76

Triadic

8F8675
768F86
86768F

Split-Comp.

8F8675
768B8F
79768F

Tetradic

8F8675
768F79
767E8F
8F768B

Contrast Matrix WCAG 2.1 Contrast

8F8675
F1E2C1
C6BBA7
AEA28C
26324A
2.8
Fail
1.9
Fail
1.4
Fail
3.6
AA Large
2.8
Fail
1.5
Fail
2.0
Fail
10.0
AAA
1.9
Fail
1.5
Fail
1.3
Fail
6.8
AA
1.4
Fail
2.0
Fail
1.3
Fail
5.1
AA
3.6
AA Large
10.0
AAA
6.8
AA
5.1
AA
White BG
3.6AA Large
1.3Fail
1.9Fail
2.5Fail
12.8AAA
Black BG
5.8AA
16.4AAA
11.1AAA
8.3AAA
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8B8B79
EBEAC9
C1C1AC
A9A991
2B2B44

Deuteranopia

8C8C7A
EBEDCB
C2C3AD
AAAA93
2B2A43

Tritanopia

8F7C7D
F0CFD1
C5B0B1
AD9696
27403F

Achromatopsia

878787
E3E3E3
BCBCBC
A3A3A3
313131

Shades & Tints Shades & Tints

#8F8675

Dark
Light

#F1E2C1

Dark
Light

#C6BBA7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f8675;
  --color-2: #f1e2c1;
  --color-3: #c6bba7;
  --color-4: #aea28c;
  --color-5: #26324a;
}

SCSS

$color-1: #8f8675;
$color-2: #f1e2c1;
$color-3: #c6bba7;
$color-4: #aea28c;
$color-5: #26324a;

TAILWIND

colors: {
  'brand-1': '#8f8675',
  'brand-2': '#f1e2c1',
  'brand-3': '#c6bba7',
  'brand-4': '#aea28c',
  'brand-5': '#26324a',
}

RGB Array

[143, 134, 117], [241, 226, 193], [198, 187, 167], [174, 162, 140], [38, 50, 74]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8F8675, #F1E2C1, #C6BBA7, #AEA28C, #26324A is ideal for: brand design, premium product pages, magazine layouts, 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: #8f8675; --color-2: #f1e2c1; --color-3: #c6bba7; --color-4: #aea28c; --color-5: #26324a. 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. 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 tech, SaaS, healthcare, eco 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