← Back to Editor

#649456 · #9E6A0E · #6B6136 · #836914 · #B99829

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 Library

Color Details Color Details

#649456

Celadon · DimGray · Olive Green

HEX
#649456
RGB
rgb(100, 148, 86)
HSL
hsl(106, 26%, 46%)
HSB
hsb(106, 42%, 58%)
CMYK
cmyk(32%, 0%, 42%, 42%)
Oklch
oklch(61.6% 0.104 138.8)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#9E6A0E

Ochre · DarkGoldenRod · Amber Brown

HEX
#9E6A0E
RGB
rgb(158, 106, 14)
HSL
hsl(38, 84%, 34%)
HSB
hsb(38, 91%, 62%)
CMYK
cmyk(0%, 33%, 91%, 38%)
Oklch
oklch(56.6% 0.116 73.9)

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

#6B6136

Ochre · DarkOliveGreen · Honey Gold

HEX
#6B6136
RGB
rgb(107, 97, 54)
HSL
hsl(49, 33%, 32%)
HSB
hsb(49, 50%, 42%)
CMYK
cmyk(0%, 9%, 50%, 58%)
Oklch
oklch(49.2% 0.063 96.6)

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

#836914

Ochre · Olive · Honey Gold

HEX
#836914
RGB
rgb(131, 105, 20)
HSL
hsl(46, 74%, 30%)
HSB
hsb(46, 85%, 51%)
CMYK
cmyk(0%, 20%, 85%, 49%)
Oklch
oklch(53.2% 0.102 90.2)

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

#B99829

Ochre · DarkGoldenRod · Honey Gold

HEX
#B99829
RGB
rgb(185, 152, 41)
HSL
hsl(46, 64%, 44%)
HSB
hsb(46, 78%, 73%)
CMYK
cmyk(0%, 18%, 78%, 27%)
Oklch
oklch(69.1% 0.128 91.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

649456
865794

Analogous

849457
649456
579467

Triadic

649456
576594
945765

Split-Comp.

649456
675794
945784

Tetradic

649456
578494
865794
946757

Contrast Matrix WCAG 2.1 Contrast

649456
9E6A0E
6B6136
836914
B99829
—
1.3
Fail
1.7
Fail
1.5
Fail
1.3
Fail
1.3
Fail
—
1.3
Fail
1.1
Fail
1.7
Fail
1.7
Fail
1.3
Fail
—
1.2
Fail
2.2
Fail
1.5
Fail
1.1
Fail
1.2
Fail
—
1.9
Fail
1.3
Fail
1.7
Fail
2.2
Fail
1.9
Fail
—
White BG
3.6AA Large
4.6AA
6.2AA
5.3AA
2.8Fail
Black BG
5.9AA
4.5AA
3.4AA Large
4.0AA Large
7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

797965
878724
676740
787829
ABAA44

Deuteranopia

767269
8B8E2A
676843
797B2E
ADAF4A

Tritanopia

667173
9B363A
6A494A
82393C
B7595E

Achromatopsia

7F7F7F
6F6F6F
5F5F5F
676767
959595

Shades & Tints Shades & Tints

#649456

Dark
Light

#9E6A0E

Dark
Light

#6B6136

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #649456;
  --color-2: #9e6a0e;
  --color-3: #6b6136;
  --color-4: #836914;
  --color-5: #b99829;
}

SCSS

$color-1: #649456;
$color-2: #9e6a0e;
$color-3: #6b6136;
$color-4: #836914;
$color-5: #b99829;

TAILWIND

colors: {
  'brand-1': '#649456',
  'brand-2': '#9e6a0e',
  'brand-3': '#6b6136',
  'brand-4': '#836914',
  'brand-5': '#b99829',
}

RGB Array

[100, 148, 86], [158, 106, 14], [107, 97, 54], [131, 105, 20], [185, 152, 41]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #649456, #9E6A0E, #6B6136, #836914, #B99829 is ideal for: tech websites, dark mode UIs, game UIs. 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: #649456; --color-2: #9e6a0e; --color-3: #6b6136; --color-4: #836914; --color-5: #b99829. 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. 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