← Back to Editor

#85A198 · #90916D · #874D2F · #99701D · #38251C

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

#85A198

Mineral Blue · LightSlateGray · Lake Green

HEX
#85A198
RGB
rgb(133, 161, 152)
HSL
hsl(161, 13%, 58%)
HSB
hsb(161, 17%, 63%)
CMYK
cmyk(17%, 0%, 6%, 37%)
Oklch
oklch(68.5% 0.034 173.8)

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

#90916D

Autumn Sage · Gray · Honey Gold

HEX
#90916D
RGB
rgb(144, 145, 109)
HSL
hsl(62, 14%, 50%)
HSB
hsb(62, 25%, 57%)
CMYK
cmyk(1%, 0%, 25%, 43%)
Oklch
oklch(64.6% 0.051 109.1)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#874D2F

Tangerine · Sienna · Amber Brown

HEX
#874D2F
RGB
rgb(135, 77, 47)
HSL
hsl(20, 48%, 36%)
HSB
hsb(20, 65%, 53%)
CMYK
cmyk(0%, 43%, 65%, 47%)
Oklch
oklch(48.2% 0.090 47.1)

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

#99701D

Ochre · Sienna · Honey Gold

HEX
#99701D
RGB
rgb(153, 112, 29)
HSL
hsl(40, 68%, 36%)
HSB
hsb(40, 81%, 60%)
CMYK
cmyk(0%, 27%, 81%, 40%)
Oklch
oklch(57.2% 0.108 80.2)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#38251C

Tangerine · DarkSlateGray · Cinnamon

HEX
#38251C
RGB
rgb(56, 37, 28)
HSL
hsl(19, 33%, 16%)
HSB
hsb(19, 50%, 22%)
CMYK
cmyk(0%, 34%, 50%, 78%)
Oklch
oklch(28.5% 0.033 46.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

85A198
A2868F

Analogous

86A28B
85A198
869DA2

Triadic

85A198
9986A2
A29986

Split-Comp.

85A198
A2869D
A28B86

Tetradic

85A198
8B86A2
A2868F
9DA286

Contrast Matrix WCAG 2.1 Contrast

85A198
90916D
874D2F
99701D
38251C
—
1.2
Fail
2.4
Fail
1.6
Fail
5.2
AA
1.2
Fail
—
2.1
Fail
1.4
Fail
4.5
AA Large
2.4
Fail
2.1
Fail
—
1.5
Fail
2.2
Fail
1.6
Fail
1.4
Fail
1.5
Fail
—
3.2
AA Large
5.2
AA
4.5
AA Large
2.2
Fail
3.2
AA Large
—
White BG
2.8Fail
3.3AA Large
6.7AA
4.5AA Large
14.5AAA
Black BG
7.5AAA
6.5AA
3.1AA Large
4.7AA
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

91919A
909076
6E6D36
878731
30301E

Deuteranopia

908D9B
909078
717638
8A8D36
31321F

Tritanopia

869C9C
907D7E
843C3D
974144
372020

Achromatopsia

989898
8D8D8D
5B5B5B
737373
2A2A2A

Shades & Tints Shades & Tints

#85A198

Dark
Light

#90916D

Dark
Light

#874D2F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #85a198;
  --color-2: #90916d;
  --color-3: #874d2f;
  --color-4: #99701d;
  --color-5: #38251c;
}

SCSS

$color-1: #85a198;
$color-2: #90916d;
$color-3: #874d2f;
$color-4: #99701d;
$color-5: #38251c;

TAILWIND

colors: {
  'brand-1': '#85a198',
  'brand-2': '#90916d',
  'brand-3': '#874d2f',
  'brand-4': '#99701d',
  'brand-5': '#38251c',
}

RGB Array

[133, 161, 152], [144, 145, 109], [135, 77, 47], [153, 112, 29], [56, 37, 28]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #85A198, #90916D, #874D2F, #99701D, #38251C is ideal for: tech websites, dark mode UIs, game UIs, 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: #85a198; --color-2: #90916d; --color-3: #874d2f; --color-4: #99701d; --color-5: #38251c. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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