#A7362E + #3C413A + #80775A + #A36F0C + #6D411E · vintage - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPoster

Color Details Color Details

#A7362E

Crimson · Brown · Passion Red

HEX

#A7362E

RGB

rgb(167, 54, 46)

HSL

hsl(4, 57%, 42%)

HSB

hsb(4, 72%, 65%)

CMYK

cmyk(0%, 68%, 72%, 35%)

Oklch

oklch(49.7% 0.150 27.9)

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

#3C413A

Dark Cyan · DarkSlateGray · Dark Stone

HEX

#3C413A

RGB

rgb(60, 65, 58)

HSL

hsl(103, 6%, 24%)

HSB

hsb(103, 11%, 25%)

CMYK

cmyk(8%, 0%, 11%, 75%)

Oklch

oklch(36.8% 0.014 136.6)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#80775A

Ochre · DimGray · Honey Gold

HEX

#80775A

RGB

rgb(128, 119, 90)

HSL

hsl(46, 17%, 43%)

HSB

hsb(46, 30%, 50%)

CMYK

cmyk(0%, 7%, 30%, 50%)

Oklch

oklch(57.0% 0.044 92.9)

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

#A36F0C

Ochre · DarkGoldenRod · Amber Brown

HEX

#A36F0C

RGB

rgb(163, 111, 12)

HSL

hsl(39, 86%, 34%)

HSB

hsb(39, 93%, 64%)

CMYK

cmyk(0%, 32%, 93%, 36%)

Oklch

oklch(58.2% 0.119 75.4)

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

#6D411E

Tangerine · DarkOliveGreen · Amber Brown

HEX

#6D411E

RGB

rgb(109, 65, 30)

HSL

hsl(27, 57%, 27%)

HSB

hsb(27, 72%, 43%)

CMYK

cmyk(0%, 40%, 72%, 57%)

Oklch

oklch(42.0% 0.078 56.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A7362E

2EA0A8

Analogous

A82E63

A7362E

A8732E

Triadic

A7362E

2EA836

362EA8

Split-Comp.

A7362E

2EA873

2E63A8

Tetradic

A7362E

63A82E

2EA0A8

732EA8

Contrast Matrix WCAG 2.1 Contrast

A7362E	3C413A	80775A	A36F0C	6D411E
—	1.6 Fail	1.5 Fail	1.5 Fail	1.3 Fail
1.6 Fail	—	2.3 Fail	2.4 Fail	1.2 Fail
1.5 Fail	2.3 Fail	—	1.0 Fail	1.9 Fail
1.5 Fail	2.4 Fail	1.0 Fail	—	2.0 Fail
1.3 Fail	1.2 Fail	1.9 Fail	2.0 Fail	—

White BG

6.5AA

10.5AAA

4.5AA Large

4.3AA Large

8.7AAA

Black BG

3.2AA Large

2.0Fail

4.7AA

4.8AA

2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

767530

3E3E3C

7C7C61

8C8C24

5A5A26

Deuteranopia

7D8530

3E3E3C

7D7D63

90932A

5D6029

Tritanopia

A13132

3C3D3D

806768

A0373B

6B2D2F

Achromatopsia

575757

3F3F3F

767676

737373

4A4A4A

Shades & Tints Shades & Tints

#A7362E

Dark

Light

#3C413A

Dark

Light

#80775A

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a7362e;
  --color-2: #3c413a;
  --color-3: #80775a;
  --color-4: #a36f0c;
  --color-5: #6d411e;
}

SCSS

$color-1: #a7362e;
$color-2: #3c413a;
$color-3: #80775a;
$color-4: #a36f0c;
$color-5: #6d411e;

TAILWIND

colors: {
  'brand-1': '#a7362e',
  'brand-2': '#3c413a',
  'brand-3': '#80775a',
  'brand-4': '#a36f0c',
  'brand-5': '#6d411e',
}

RGB Array

[167, 54, 46], [60, 65, 58], [128, 119, 90], [163, 111, 12], [109, 65, 30]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #A7362E, #3C413A, #80775A, #A36F0C, #6D411E 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: #a7362e; --color-2: #3c413a; --color-3: #80775a; --color-4: #a36f0c; --color-5: #6d411e. 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 vintage-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