← Back to Editor

#363E49 · #5D594E · #8A7256 · #C68952 · #B2A769

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 Library

Color Details Color Details

#363E49

Indigo · DarkSlateGray · Prussian Blue

HEX
#363E49
RGB
rgb(54, 62, 73)
HSL
hsl(215, 15%, 25%)
HSB
hsb(215, 26%, 29%)
CMYK
cmyk(26%, 15%, 0%, 71%)
Oklch
oklch(36.1% 0.022 256.4)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#5D594E

Ochre · DimGray · Charcoal

HEX
#5D594E
RGB
rgb(93, 89, 78)
HSL
hsl(44, 9%, 34%)
HSB
hsb(44, 16%, 36%)
CMYK
cmyk(0%, 4%, 16%, 64%)
Oklch
oklch(46.4% 0.018 90.4)

Traditional「Ochre」· Paint「Charcoal」· Creative Midnight Shadow

#8A7256

Ochre · DimGray · Amber Brown

HEX
#8A7256
RGB
rgb(138, 114, 86)
HSL
hsl(32, 23%, 44%)
HSB
hsb(32, 38%, 54%)
CMYK
cmyk(0%, 17%, 38%, 46%)
Oklch
oklch(56.8% 0.051 70.8)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#C68952

Tangerine · DarkSalmon · Warm Sun

HEX
#C68952
RGB
rgb(198, 137, 82)
HSL
hsl(28, 50%, 55%)
HSB
hsb(28, 59%, 78%)
CMYK
cmyk(0%, 31%, 59%, 22%)
Oklch
oklch(68.0% 0.103 61.7)

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

#B2A769

Autumn Sage · Tan · Sunflower

HEX
#B2A769
RGB
rgb(178, 167, 105)
HSL
hsl(51, 32%, 55%)
HSB
hsb(51, 41%, 70%)
CMYK
cmyk(0%, 6%, 41%, 30%)
Oklch
oklch(72.3% 0.083 99.4)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

363E49
494136

Analogous

364849
363E49
383649

Triadic

363E49
49363E
3E4936

Split-Comp.

363E49
493836
484936

Tetradic

363E49
493648
494136
364938

Contrast Matrix WCAG 2.1 Contrast

363E49
5D594E
8A7256
C68952
B2A769
—
1.5
Fail
2.4
Fail
3.7
AA Large
4.4
AA Large
1.5
Fail
—
1.5
Fail
2.4
Fail
2.9
Fail
2.4
Fail
1.5
Fail
—
1.5
Fail
1.9
Fail
3.7
AA Large
2.4
Fail
1.5
Fail
—
1.2
Fail
4.4
AA Large
2.9
Fail
1.9
Fail
1.2
Fail
—
White BG
10.8AAA
7.0AA
4.5AA
3.0Fail
2.4Fail
Black BG
1.9Fail
3.0AA Large
4.6AA
7.1AAA
8.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

393A46
5B5B51
807F5D
ACAB5F
ADAD78

Deuteranopia

393846
5C5C51
81835E
AFB463
AEAF7C

Tritanopia

364444
5D5353
896263
C36A6C
B18486

Achromatopsia

3D3D3D
595959
767676
959595
A3A3A3

Shades & Tints Shades & Tints

#363E49

Dark
Light

#5D594E

Dark
Light

#8A7256

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #363e49;
  --color-2: #5d594e;
  --color-3: #8a7256;
  --color-4: #c68952;
  --color-5: #b2a769;
}

SCSS

$color-1: #363e49;
$color-2: #5d594e;
$color-3: #8a7256;
$color-4: #c68952;
$color-5: #b2a769;

TAILWIND

colors: {
  'brand-1': '#363e49',
  'brand-2': '#5d594e',
  'brand-3': '#8a7256',
  'brand-4': '#c68952',
  'brand-5': '#b2a769',
}

RGB Array

[54, 62, 73], [93, 89, 78], [138, 114, 86], [198, 137, 82], [178, 167, 105]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #363E49, #5D594E, #8A7256, #C68952, #B2A769 is ideal for: brand design, premium product pages, magazine layouts. 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: #363e49; --color-2: #5d594e; --color-3: #8a7256; --color-4: #c68952; --color-5: #b2a769. 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. 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