← Back to Editor

#312634 · #6B585E · #BFA397 · #EECEA5 · #F8F0C2

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#312634

Dark Plum · DarkSlateGray · Dark Purple

HEX
#312634
RGB
rgb(49, 38, 52)
HSL
hsl(287, 16%, 18%)
HSB
hsb(287, 27%, 20%)
CMYK
cmyk(6%, 27%, 0%, 80%)
Oklch
oklch(28.7% 0.029 318.9)

Traditional「Dark Plum」· Paint「Dark Purple」· Creative Blush Sunrise

#6B585E

Dark Violet · DimGray · Camellia

HEX
#6B585E
RGB
rgb(107, 88, 94)
HSL
hsl(341, 10%, 38%)
HSB
hsb(341, 18%, 42%)
CMYK
cmyk(0%, 18%, 12%, 58%)
Oklch
oklch(48.1% 0.026 357.2)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#BFA397

Apricot · Tan · Warm Sun

HEX
#BFA397
RGB
rgb(191, 163, 151)
HSL
hsl(18, 24%, 67%)
HSB
hsb(18, 21%, 75%)
CMYK
cmyk(0%, 15%, 21%, 25%)
Oklch
oklch(73.7% 0.037 44.5)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#EECEA5

Goose Yellow · Wheat · Peach Orange

HEX
#EECEA5
RGB
rgb(238, 206, 165)
HSL
hsl(34, 68%, 79%)
HSB
hsb(34, 31%, 93%)
CMYK
cmyk(0%, 13%, 31%, 7%)
Oklch
oklch(86.8% 0.065 73.7)

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

#F8F0C2

Fresh Green · Bisque · Lemon Cream

HEX
#F8F0C2
RGB
rgb(248, 240, 194)
HSL
hsl(51, 79%, 87%)
HSB
hsb(51, 22%, 97%)
CMYK
cmyk(0%, 3%, 22%, 3%)
Oklch
oklch(95.0% 0.060 99.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

312634
2A3527

Analogous

2B2735
312634
352731

Triadic

312634
353227
273532

Split-Comp.

312634
313527
27352B

Tetradic

312634
352B27
2A3527
273135

Contrast Matrix WCAG 2.1 Contrast

312634
6B585E
BFA397
EECEA5
F8F0C2
—
2.2
Fail
6.1
AA
9.6
AAA
12.5
AAA
2.2
Fail
—
2.8
Fail
4.4
AA Large
5.7
AA
6.1
AA
2.8
Fail
—
1.6
Fail
2.0
Fail
9.6
AAA
4.4
AA Large
1.6
Fail
—
1.3
Fail
12.5
AAA
5.7
AA
2.0
Fail
1.3
Fail
—
White BG
14.4AAA
6.6AA
2.4Fail
1.5Fail
1.2Fail
Black BG
1.5Fail
3.2AA Large
8.9AAA
14.0AAA
18.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2C2C31
63635D
B3B39A
E0E0AF
F5F4CD

Deuteranopia

2D2E30
64655C
B5B79B
E2E4B1
F5F6D0

Tritanopia

302E2D
6A5B5B
BE9C9D
ECB7B8
F8D6D8

Achromatopsia

2B2B2B
5E5E5E
AAAAAA
D3D3D3
EDEDED

Shades & Tints Shades & Tints

#312634

Dark
Light

#6B585E

Dark
Light

#BFA397

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #312634;
  --color-2: #6b585e;
  --color-3: #bfa397;
  --color-4: #eecea5;
  --color-5: #f8f0c2;
}

SCSS

$color-1: #312634;
$color-2: #6b585e;
$color-3: #bfa397;
$color-4: #eecea5;
$color-5: #f8f0c2;

TAILWIND

colors: {
  'brand-1': '#312634',
  'brand-2': '#6b585e',
  'brand-3': '#bfa397',
  'brand-4': '#eecea5',
  'brand-5': '#f8f0c2',
}

RGB Array

[49, 38, 52], [107, 88, 94], [191, 163, 151], [238, 206, 165], [248, 240, 194]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #312634, #6B585E, #BFA397, #EECEA5, #F8F0C2 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #312634; --color-2: #6b585e; --color-3: #bfa397; --color-4: #eecea5; --color-5: #f8f0c2. 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. 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