← Back to Editor

#746A61 · #938374 · #AB3C31 · #7F2A31 · #4A3931

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#746A61

Tangerine · DimGray · Warm Gray

HEX
#746A61
RGB
rgb(116, 106, 97)
HSL
hsl(28, 9%, 42%)
HSB
hsb(28, 16%, 45%)
CMYK
cmyk(0%, 9%, 16%, 55%)
Oklch
oklch(53.1% 0.019 64.4)

Traditional「Tangerine」· Paint「Warm Gray」· Creative Urban Concrete

#938374

Tangerine · Gray · Warm Sun

HEX
#938374
RGB
rgb(147, 131, 116)
HSL
hsl(29, 13%, 52%)
HSB
hsb(29, 21%, 58%)
CMYK
cmyk(0%, 11%, 21%, 42%)
Oklch
oklch(62.0% 0.029 65.4)

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

#AB3C31

Crimson · Brown · Passion Red

HEX
#AB3C31
RGB
rgb(171, 60, 49)
HSL
hsl(5, 55%, 43%)
HSB
hsb(5, 71%, 67%)
CMYK
cmyk(0%, 65%, 71%, 33%)
Oklch
oklch(51.2% 0.148 28.9)

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

#7F2A31

Crimson · Brown · Wine Red

HEX
#7F2A31
RGB
rgb(127, 42, 49)
HSL
hsl(355, 50%, 33%)
HSB
hsb(355, 67%, 50%)
CMYK
cmyk(0%, 67%, 61%, 50%)
Oklch
oklch(41.4% 0.117 19.1)

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

#4A3931

Tangerine · DarkSlateGray · Cinnamon

HEX
#4A3931
RGB
rgb(74, 57, 49)
HSL
hsl(19, 20%, 24%)
HSB
hsb(19, 34%, 29%)
CMYK
cmyk(0%, 23%, 34%, 71%)
Oklch
oklch(36.1% 0.028 46.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

746A61
616C75

Analogous

756162
746A61
757461

Triadic

746A61
61756A
6A6175

Split-Comp.

746A61
617574
616275

Tetradic

746A61
627561
616C75
746175

Contrast Matrix WCAG 2.1 Contrast

746A61
938374
AB3C31
7F2A31
4A3931
—
1.4
Fail
1.2
Fail
1.7
Fail
2.1
Fail
1.4
Fail
—
1.7
Fail
2.5
Fail
3.0
Fail
1.2
Fail
1.7
Fail
—
1.5
Fail
1.8
Fail
1.7
Fail
2.5
Fail
1.5
Fail
—
1.2
Fail
2.1
Fail
3.0
Fail
1.8
Fail
1.2
Fail
—
White BG
5.3AA
3.7AA Large
6.1AA
9.2AAA
10.9AAA
Black BG
4.0AA Large
5.7AA
3.4AA Large
2.3Fail
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

707063
8C8C78
7B7A34
5A592F
434233

Deuteranopia

707164
8D8E78
818A34
5F652F
444533

Tritanopia

736565
927A7B
A53636
7B2E2E
493435

Achromatopsia

6C6C6C
868686
5C5C5C
444444
3D3D3D

Shades & Tints Shades & Tints

#746A61

Dark
Light

#938374

Dark
Light

#AB3C31

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #746a61;
  --color-2: #938374;
  --color-3: #ab3c31;
  --color-4: #7f2a31;
  --color-5: #4a3931;
}

SCSS

$color-1: #746a61;
$color-2: #938374;
$color-3: #ab3c31;
$color-4: #7f2a31;
$color-5: #4a3931;

TAILWIND

colors: {
  'brand-1': '#746a61',
  'brand-2': '#938374',
  'brand-3': '#ab3c31',
  'brand-4': '#7f2a31',
  'brand-5': '#4a3931',
}

RGB Array

[116, 106, 97], [147, 131, 116], [171, 60, 49], [127, 42, 49], [74, 57, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #746A61, #938374, #AB3C31, #7F2A31, #4A3931 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #746a61; --color-2: #938374; --color-3: #ab3c31; --color-4: #7f2a31; --color-5: #4a3931. 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 finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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