#412F2B + #803B2D + #AC622E + #A1AB55 + #7A8D72 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#412F2B

Crimson · DarkSlateGray · Wine Red

HEX

#412F2B

RGB

rgb(65, 47, 43)

HSL

hsl(11, 20%, 21%)

HSB

hsb(11, 34%, 25%)

CMYK

cmyk(0%, 28%, 34%, 75%)

Oklch

oklch(32.5% 0.028 32.8)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#803B2D

Crimson · Sienna · Wine Red

HEX

#803B2D

RGB

rgb(128, 59, 45)

HSL

hsl(10, 48%, 34%)

HSB

hsb(10, 65%, 50%)

CMYK

cmyk(0%, 54%, 65%, 50%)

Oklch

oklch(44.0% 0.099 32.9)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#AC622E

Tangerine · Sienna · Amber Brown

HEX

#AC622E

RGB

rgb(172, 98, 46)

HSL

hsl(25, 58%, 43%)

HSB

hsb(25, 73%, 67%)

CMYK

cmyk(0%, 43%, 73%, 33%)

Oklch

oklch(57.1% 0.116 53.0)

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

#A1AB55

Autumn Sage · DarkSeaGreen · Honey Gold

HEX

#A1AB55

RGB

rgb(161, 171, 85)

HSL

hsl(67, 34%, 50%)

HSB

hsb(67, 50%, 67%)

CMYK

cmyk(6%, 0%, 50%, 33%)

Oklch

oklch(71.5% 0.111 114.7)

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

#7A8D72

Celadon · Gray · Olive Green

HEX

#7A8D72

RGB

rgb(122, 141, 114)

HSL

hsl(102, 11%, 50%)

HSB

hsb(102, 19%, 55%)

CMYK

cmyk(13%, 0%, 19%, 45%)

Oklch

oklch(62.1% 0.045 136.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

412F2B

2B3C40

Analogous

402B32

412F2B

40392B

Triadic

412F2B

2B402F

2F2B40

Split-Comp.

412F2B

2B4039

2B3240

Tetradic

412F2B

32402B

2B3C40

392B40

Contrast Matrix WCAG 2.1 Contrast

412F2B	803B2D	AC622E	A1AB55	7A8D72
—	1.5 Fail	2.7 Fail	5.1 AA	3.5 AA Large
1.5 Fail	—	1.8 Fail	3.3 AA Large	2.3 Fail
2.7 Fail	1.8 Fail	—	1.9 Fail	1.3 Fail
5.1 AA	3.3 AA Large	1.9 Fail	—	1.4 Fail
3.5 AA Large	2.3 Fail	1.3 Fail	1.4 Fail	—

White BG

12.6AAA

8.1AAA

4.6AA

2.5Fail

3.6AA Large

Black BG

1.7Fail

2.6Fail

4.5AA

8.5AAA

5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

39392C

626230

8C8B3B

A5A56A

828279

Deuteranopia

3A3C2C

666B31

90963E

A5A46F

81807A

Tritanopia

402D2D

7D3334

A84547

A27A7E

7B7E7F

Achromatopsia

343434

4E4E4E

727272

9E9E9E

848484

Shades & Tints Shades & Tints

#412F2B

Dark

Light

#803B2D

Dark

Light

#AC622E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #412f2b;
  --color-2: #803b2d;
  --color-3: #ac622e;
  --color-4: #a1ab55;
  --color-5: #7a8d72;
}

SCSS

$color-1: #412f2b;
$color-2: #803b2d;
$color-3: #ac622e;
$color-4: #a1ab55;
$color-5: #7a8d72;

TAILWIND

colors: {
  'brand-1': '#412f2b',
  'brand-2': '#803b2d',
  'brand-3': '#ac622e',
  'brand-4': '#a1ab55',
  'brand-5': '#7a8d72',
}

RGB Array

[65, 47, 43], [128, 59, 45], [172, 98, 46], [161, 171, 85], [122, 141, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #412F2B, #803B2D, #AC622E, #A1AB55, #7A8D72 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: #412f2b; --color-2: #803b2d; --color-3: #ac622e; --color-4: #a1ab55; --color-5: #7a8d72. 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