← Back to Editor

#351D15 · #253235 · #76959A · #BBB09F · #EEE5D0

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

#351D15

Tangerine · Black · Cinnamon

HEX
#351D15
RGB
rgb(53, 29, 21)
HSL
hsl(15, 43%, 15%)
HSB
hsb(15, 60%, 21%)
CMYK
cmyk(0%, 45%, 60%, 79%)
Oklch
oklch(26.1% 0.041 39.2)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#253235

Slate Blue · DarkSlateGray · Peacock Green

HEX
#253235
RGB
rgb(37, 50, 53)
HSL
hsl(191, 18%, 18%)
HSB
hsb(191, 30%, 21%)
CMYK
cmyk(30%, 6%, 0%, 79%)
Oklch
oklch(30.7% 0.018 213.4)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#76959A

Slate Blue · LightSlateGray · Lake Green

HEX
#76959A
RGB
rgb(118, 149, 154)
HSL
hsl(188, 15%, 53%)
HSB
hsb(188, 23%, 60%)
CMYK
cmyk(23%, 3%, 0%, 40%)
Oklch
oklch(64.8% 0.035 208.4)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

#BBB09F

Ginger · DarkGray · Warm Sun

HEX
#BBB09F
RGB
rgb(187, 176, 159)
HSL
hsl(36, 17%, 68%)
HSB
hsb(36, 15%, 73%)
CMYK
cmyk(0%, 6%, 15%, 27%)
Oklch
oklch(76.2% 0.027 78.9)

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

#EEE5D0

Goose Yellow · Bisque · Lemon Cream

HEX
#EEE5D0
RGB
rgb(238, 229, 208)
HSL
hsl(42, 47%, 87%)
HSB
hsb(42, 13%, 93%)
CMYK
cmyk(0%, 4%, 13%, 7%)
Oklch
oklch(92.3% 0.030 87.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

351D15
162E37

Analogous

37161E
351D15
372E16

Triadic

351D15
16371E
1E1637

Split-Comp.

351D15
16372E
161E37

Tetradic

351D15
1E3716
162E37
2E1637

Contrast Matrix WCAG 2.1 Contrast

351D15
253235
76959A
BBB09F
EEE5D0
—
1.2
Fail
4.9
AA
7.3
AAA
12.5
AAA
1.2
Fail
—
4.1
AA Large
6.2
AA
10.6
AAA
4.9
AA
4.1
AA Large
—
1.5
Fail
2.6
Fail
7.3
AAA
6.2
AA
1.5
Fail
—
1.7
Fail
12.5
AAA
10.6
AAA
2.6
Fail
1.7
Fail
—
White BG
15.7AAA
13.2AAA
3.2AA Large
2.1Fail
1.3Fail
Black BG
1.3Fail
1.6Fail
6.5AA
9.8AAA
16.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2B2A17
2B2B34
838499
B6B6A3
EAEAD5

Deuteranopia

2C2E17
2A2934
827F99
B7B8A4
EBEBD6

Tritanopia

341819
263434
789898
BAA6A7
EED9DA

Achromatopsia

232323
2E2E2E
8C8C8C
B1B1B1
E5E5E5

Shades & Tints Shades & Tints

#351D15

Dark
Light

#253235

Dark
Light

#76959A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #351d15;
  --color-2: #253235;
  --color-3: #76959a;
  --color-4: #bbb09f;
  --color-5: #eee5d0;
}

SCSS

$color-1: #351d15;
$color-2: #253235;
$color-3: #76959a;
$color-4: #bbb09f;
$color-5: #eee5d0;

TAILWIND

colors: {
  'brand-1': '#351d15',
  'brand-2': '#253235',
  'brand-3': '#76959a',
  'brand-4': '#bbb09f',
  'brand-5': '#eee5d0',
}

RGB Array

[53, 29, 21], [37, 50, 53], [118, 149, 154], [187, 176, 159], [238, 229, 208]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #351D15, #253235, #76959A, #BBB09F, #EEE5D0 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: #351d15; --color-2: #253235; --color-3: #76959a; --color-4: #bbb09f; --color-5: #eee5d0. 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