#A18B74 + #625243 + #473B2F + #B2000B + #721B12 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#A18B74

Ginger · Gray · Warm Sun

HEX

#A18B74

RGB

rgb(161, 139, 116)

HSL

hsl(31, 19%, 54%)

HSB

hsb(31, 28%, 63%)

CMYK

cmyk(0%, 14%, 28%, 37%)

Oklch

oklch(65.1% 0.042 68.2)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#625243

Tangerine · DarkOliveGreen · Amber Brown

HEX

#625243

RGB

rgb(98, 82, 67)

HSL

hsl(29, 19%, 32%)

HSB

hsb(29, 32%, 38%)

CMYK

cmyk(0%, 16%, 32%, 62%)

Oklch

oklch(45.0% 0.032 65.0)

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

#473B2F

Ochre · DarkSlateGray · Cinnamon

HEX

#473B2F

RGB

rgb(71, 59, 47)

HSL

hsl(30, 20%, 23%)

HSB

hsb(30, 34%, 28%)

CMYK

cmyk(0%, 17%, 34%, 72%)

Oklch

oklch(36.1% 0.026 66.8)

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

#B2000B

Vermilion · DarkRed · Wine Red

HEX

#B2000B

RGB

rgb(178, 0, 11)

HSL

hsl(356, 100%, 35%)

HSB

hsb(356, 100%, 70%)

CMYK

cmyk(0%, 100%, 94%, 30%)

Oklch

oklch(48.0% 0.196 27.9)

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

#721B12

Vermilion · Maroon · Wine Red

HEX

#721B12

RGB

rgb(114, 27, 18)

HSL

hsl(6, 73%, 26%)

HSB

hsb(6, 84%, 45%)

CMYK

cmyk(0%, 76%, 84%, 55%)

Oklch

oklch(36.8% 0.122 29.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A18B74

7389A0

Analogous

A07473

A18B74

9FA073

Triadic

A18B74

73A08A

8A73A0

Split-Comp.

A18B74

739FA0

7473A0

Tetradic

A18B74

73A074

7389A0

A0739F

Contrast Matrix WCAG 2.1 Contrast

A18B74	625243	473B2F	B2000B	721B12
—	2.3 Fail	3.3 AA Large	2.2 Fail	3.4 AA Large
2.3 Fail	—	1.5 Fail	1.0 Fail	1.5 Fail
3.3 AA Large	1.5 Fail	—	1.5 Fail	1.0 Fail
2.2 Fail	1.0 Fail	1.5 Fail	—	1.5 Fail
3.4 AA Large	1.5 Fail	1.0 Fail	1.5 Fail	—

White BG

3.3AA Large

7.5AAA

10.9AAA

7.2AAA

11.2AAA

Black BG

6.5AA

2.8Fail

1.9Fail

2.9Fail

1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

97977A

5B5B47

424232

656308

4C4C14

Deuteranopia

999A7B

5C5D48

434333

6F7D08

515815

Tritanopia

A07E7F

61494A

463435

A90606

6E1616

Achromatopsia

8F8F8F

555555

3D3D3D

363636

343434

Shades & Tints Shades & Tints

#A18B74

Dark

Light

#625243

Dark

Light

#473B2F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a18b74;
  --color-2: #625243;
  --color-3: #473b2f;
  --color-4: #b2000b;
  --color-5: #721b12;
}

SCSS

$color-1: #a18b74;
$color-2: #625243;
$color-3: #473b2f;
$color-4: #b2000b;
$color-5: #721b12;

TAILWIND

colors: {
  'brand-1': '#a18b74',
  'brand-2': '#625243',
  'brand-3': '#473b2f',
  'brand-4': '#b2000b',
  'brand-5': '#721b12',
}

RGB Array

[161, 139, 116], [98, 82, 67], [71, 59, 47], [178, 0, 11], [114, 27, 18]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A18B74, #625243, #473B2F, #B2000B, #721B12 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: #a18b74; --color-2: #625243; --color-3: #473b2f; --color-4: #b2000b; --color-5: #721b12. 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