← Back to Editor

#44081A · #543344 · #3C785C · #7B942B · #A2A37F

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

#44081A

Dark Violet · Maroon · Raspberry

HEX
#44081A
RGB
rgb(68, 8, 26)
HSL
hsl(342, 79%, 15%)
HSB
hsb(342, 88%, 27%)
CMYK
cmyk(0%, 88%, 62%, 73%)
Oklch
oklch(25.7% 0.089 9.1)

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

#543344

Rose Purple · DarkSlateGray · Camellia

HEX
#543344
RGB
rgb(84, 51, 68)
HSL
hsl(329, 24%, 26%)
HSB
hsb(329, 39%, 33%)
CMYK
cmyk(0%, 39%, 19%, 67%)
Oklch
oklch(36.7% 0.054 347.9)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#3C785C

Mineral Blue · SeaGreen · Forest Green

HEX
#3C785C
RGB
rgb(60, 120, 92)
HSL
hsl(152, 33%, 35%)
HSB
hsb(152, 50%, 47%)
CMYK
cmyk(50%, 0%, 23%, 53%)
Oklch
oklch(52.4% 0.078 161.8)

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

#7B942B

Grass Green · Olive · Forest Green

HEX
#7B942B
RGB
rgb(123, 148, 43)
HSL
hsl(74, 55%, 37%)
HSB
hsb(74, 71%, 58%)
CMYK
cmyk(17%, 0%, 71%, 42%)
Oklch
oklch(62.6% 0.132 122.0)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

#A2A37F

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A2A37F
RGB
rgb(162, 163, 127)
HSL
hsl(62, 16%, 57%)
HSB
hsb(62, 22%, 64%)
CMYK
cmyk(1%, 0%, 22%, 36%)
Oklch
oklch(70.5% 0.050 108.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

44081A
084432

Analogous

440838
44081A
441408

Triadic

44081A
1A4408
081A44

Split-Comp.

44081A
084414
083844

Tetradic

44081A
384408
084432
140844

Contrast Matrix WCAG 2.1 Contrast

44081A
543344
3C785C
7B942B
A2A37F
—
1.5
Fail
3.1
AA Large
4.7
AA
6.2
AA
1.5
Fail
—
2.1
Fail
3.2
AA Large
4.2
AA Large
3.1
AA Large
2.1
Fail
—
1.5
Fail
2.0
Fail
4.7
AA
3.2
AA Large
1.5
Fail
—
1.3
Fail
6.2
AA
4.2
AA Large
2.0
Fail
1.3
Fail
—
White BG
16.2AAA
10.9AAA
5.2AA
3.4AA Large
2.6Fail
Black BG
1.3Fail
1.9Fail
4.0AA Large
6.1AA
8.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2A2916
464540
565763
868644
A2A288

Deuteranopia

2E3215
484A3F
534E64
84834B
A2A28A

Tritanopia

411211
523D3C
3F6869
7C585D
A28F90

Achromatopsia

1C1C1C
3F3F3F
636363
818181
9F9F9F

Shades & Tints Shades & Tints

#44081A

Dark
Light

#543344

Dark
Light

#3C785C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #44081a;
  --color-2: #543344;
  --color-3: #3c785c;
  --color-4: #7b942b;
  --color-5: #a2a37f;
}

SCSS

$color-1: #44081a;
$color-2: #543344;
$color-3: #3c785c;
$color-4: #7b942b;
$color-5: #a2a37f;

TAILWIND

colors: {
  'brand-1': '#44081a',
  'brand-2': '#543344',
  'brand-3': '#3c785c',
  'brand-4': '#7b942b',
  'brand-5': '#a2a37f',
}

RGB Array

[68, 8, 26], [84, 51, 68], [60, 120, 92], [123, 148, 43], [162, 163, 127]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #44081A, #543344, #3C785C, #7B942B, #A2A37F 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: #44081a; --color-2: #543344; --color-3: #3c785c; --color-4: #7b942b; --color-5: #a2a37f. 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