← Back to Editor

#A37A70 · #F23033 · #CC1240 · #4D062B · #000000

bright

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#A37A70

Crimson · Gray · Passion Red

HEX
#A37A70
RGB
rgb(163, 122, 112)
HSL
hsl(12, 22%, 54%)
HSB
hsb(12, 31%, 64%)
CMYK
cmyk(0%, 25%, 31%, 36%)
Oklch
oklch(61.7% 0.054 34.1)

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

#F23033

Vermilion · Crimson · Passion Red

HEX
#F23033
RGB
rgb(242, 48, 51)
HSL
hsl(359, 88%, 57%)
HSB
hsb(359, 80%, 95%)
CMYK
cmyk(0%, 80%, 79%, 5%)
Oklch
oklch(62.4% 0.227 26.3)

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

#CC1240

Vermilion · Crimson · Passion Red

HEX
#CC1240
RGB
rgb(204, 18, 64)
HSL
hsl(345, 84%, 44%)
HSB
hsb(345, 91%, 80%)
CMYK
cmyk(0%, 91%, 69%, 20%)
Oklch
oklch(54.1% 0.209 17.1)

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

#4D062B

Rose Purple · Maroon · Raspberry

HEX
#4D062B
RGB
rgb(77, 6, 43)
HSL
hsl(329, 86%, 16%)
HSB
hsb(329, 92%, 30%)
CMYK
cmyk(0%, 92%, 44%, 70%)
Oklch
oklch(28.0% 0.106 355.5)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#000000

Ink Black · Black · Jet Black

HEX
#000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
HSB
hsb(0, 0%, 0%)
CMYK
cmyk(0%, 0%, 0%, 100%)
Oklch
oklch(0.0% 0.000 0.0)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A37A70
7099A4

Analogous

A4707F
A37A70
A49470

Triadic

A37A70
70A47A
7A70A4

Split-Comp.

A37A70
70A494
707FA4

Tetradic

A37A70
7FA470
7099A4
9470A4

Contrast Matrix WCAG 2.1 Contrast

A37A70
F23033
CC1240
4D062B
000000
—
1.1
Fail
1.5
Fail
4.1
AA Large
5.6
AA
1.1
Fail
—
1.4
Fail
3.8
AA Large
5.2
AA
1.5
Fail
1.4
Fail
—
2.7
Fail
3.7
AA Large
4.1
AA Large
3.8
AA Large
2.7
Fail
—
1.4
Fail
5.6
AA
5.2
AA
3.7
AA Large
1.4
Fail
—
White BG
3.8AA Large
4.0AA Large
5.6AA
15.3AAA
21.0AAA
Black BG
5.6AA
5.2AA
3.7AA Large
1.4Fail
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

919172
9E9C32
7B7A35
2E2E22
000000

Deuteranopia

949773
A9B832
869432
323820
000000

Tritanopia

A17475
E83232
C32C2A
491B19
000000

Achromatopsia

858585
6A6A6A
4F4F4F
1F1F1F
000000

Shades & Tints Shades & Tints

#A37A70

Dark
Light

#F23033

Dark
Light

#CC1240

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a37a70;
  --color-2: #f23033;
  --color-3: #cc1240;
  --color-4: #4d062b;
  --color-5: #000000;
}

SCSS

$color-1: #a37a70;
$color-2: #f23033;
$color-3: #cc1240;
$color-4: #4d062b;
$color-5: #000000;

TAILWIND

colors: {
  'brand-1': '#a37a70',
  'brand-2': '#f23033',
  'brand-3': '#cc1240',
  'brand-4': '#4d062b',
  'brand-5': '#000000',
}

RGB Array

[163, 122, 112], [242, 48, 51], [204, 18, 64], [77, 6, 43], [0, 0, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #A37A70, #F23033, #CC1240, #4D062B, #000000 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: #a37a70; --color-2: #f23033; --color-3: #cc1240; --color-4: #4d062b; --color-5: #000000. 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 bright-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