← Back to Editor

#7A1507 · #AB3D26 · #D98E29 · #3C5C5D · #0E1F27

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

#7A1507

Vermilion · Maroon · Wine Red

HEX
#7A1507
RGB
rgb(122, 21, 7)
HSL
hsl(7, 89%, 25%)
HSB
hsb(7, 94%, 48%)
CMYK
cmyk(0%, 83%, 94%, 52%)
Oklch
oklch(37.7% 0.137 31.2)

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

#AB3D26

Vermilion · Brown · Passion Red

HEX
#AB3D26
RGB
rgb(171, 61, 38)
HSL
hsl(10, 64%, 41%)
HSB
hsb(10, 78%, 67%)
CMYK
cmyk(0%, 64%, 78%, 33%)
Oklch
oklch(51.2% 0.149 33.6)

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

#D98E29

Ginger · GoldenRod · Warm Sun

HEX
#D98E29
RGB
rgb(217, 142, 41)
HSL
hsl(34, 70%, 51%)
HSB
hsb(34, 81%, 85%)
CMYK
cmyk(0%, 35%, 81%, 15%)
Oklch
oklch(70.7% 0.141 68.6)

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

#3C5C5D

Slate Blue · DarkSlateGray · Mint Ice

HEX
#3C5C5D
RGB
rgb(60, 92, 93)
HSL
hsl(182, 22%, 30%)
HSB
hsb(182, 35%, 36%)
CMYK
cmyk(35%, 1%, 0%, 64%)
Oklch
oklch(45.0% 0.037 198.4)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#0E1F27

Slate Blue · Black · Peacock Green

HEX
#0E1F27
RGB
rgb(14, 31, 39)
HSL
hsl(199, 47%, 10%)
HSB
hsb(199, 64%, 15%)
CMYK
cmyk(64%, 21%, 0%, 85%)
Oklch
oklch(22.8% 0.028 229.9)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7A1507
076B78

Analogous

780733
7A1507
784D07

Triadic

7A1507
077814
140778

Split-Comp.

7A1507
07784D
073378

Tetradic

7A1507
337807
076B78
4D0778

Contrast Matrix WCAG 2.1 Contrast

7A1507
AB3D26
D98E29
3C5C5D
0E1F27
—
1.8
Fail
4.1
AA Large
1.5
Fail
1.6
Fail
1.8
Fail
—
2.3
Fail
1.2
Fail
2.8
Fail
4.1
AA Large
2.3
Fail
—
2.7
Fail
6.3
AA
1.5
Fail
1.2
Fail
2.7
Fail
—
2.3
Fail
1.6
Fail
2.8
Fail
6.3
AA
2.3
Fail
—
White BG
10.8AAA
6.1AA
2.7Fail
7.3AAA
16.9AAA
Black BG
1.9Fail
3.4AA Large
7.9AAA
2.9Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4E4D0A
7B7A2C
B9B841
4A4A5D
151625

Deuteranopia

545C0B
828A2D
BDC247
48465D
141325

Tritanopia

750D0E
A63031
D55559
3E5D5D
0F2423

Achromatopsia

323232
5B5B5B
999999
535353
1B1B1B

Shades & Tints Shades & Tints

#7A1507

Dark
Light

#AB3D26

Dark
Light

#D98E29

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7a1507;
  --color-2: #ab3d26;
  --color-3: #d98e29;
  --color-4: #3c5c5d;
  --color-5: #0e1f27;
}

SCSS

$color-1: #7a1507;
$color-2: #ab3d26;
$color-3: #d98e29;
$color-4: #3c5c5d;
$color-5: #0e1f27;

TAILWIND

colors: {
  'brand-1': '#7a1507',
  'brand-2': '#ab3d26',
  'brand-3': '#d98e29',
  'brand-4': '#3c5c5d',
  'brand-5': '#0e1f27',
}

RGB Array

[122, 21, 7], [171, 61, 38], [217, 142, 41], [60, 92, 93], [14, 31, 39]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7A1507, #AB3D26, #D98E29, #3C5C5D, #0E1F27 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: #7a1507; --color-2: #ab3d26; --color-3: #d98e29; --color-4: #3c5c5d; --color-5: #0e1f27. 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