#BE5220 + #AA3A22 + #5C2826 + #1E113A + #313851 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#BE5220

Tangerine · Chocolate · Amber Brown

HEX

#BE5220

RGB

rgb(190, 82, 32)

HSL

hsl(19, 71%, 44%)

HSB

hsb(19, 83%, 75%)

CMYK

cmyk(0%, 57%, 83%, 25%)

Oklch

oklch(57.0% 0.152 42.4)

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

#AA3A22

Vermilion · Brown · Wine Red

HEX

#AA3A22

RGB

rgb(170, 58, 34)

HSL

hsl(11, 67%, 40%)

HSB

hsb(11, 80%, 67%)

CMYK

cmyk(0%, 66%, 80%, 33%)

Oklch

oklch(50.6% 0.152 33.7)

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

#5C2826

Crimson · Maroon · Wine Red

HEX

#5C2826

RGB

rgb(92, 40, 38)

HSL

hsl(2, 42%, 25%)

HSB

hsb(2, 59%, 36%)

CMYK

cmyk(0%, 57%, 59%, 64%)

Oklch

oklch(34.9% 0.077 24.1)

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

#1E113A

Deep Indigo · MidnightBlue · Deep Sea Blue

HEX

#1E113A

RGB

rgb(30, 17, 58)

HSL

hsl(259, 55%, 15%)

HSB

hsb(259, 71%, 23%)

CMYK

cmyk(48%, 71%, 0%, 77%)

Oklch

oklch(22.2% 0.076 294.0)

Traditional「Deep Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#313851

Indigo · DarkSlateGray · Prussian Blue

HEX

#313851

RGB

rgb(49, 56, 81)

HSL

hsl(227, 25%, 25%)

HSB

hsb(227, 40%, 32%)

CMYK

cmyk(40%, 31%, 0%, 68%)

Oklch

oklch(34.6% 0.045 271.9)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BE5220

218DC0

Analogous

C0213E

BE5220

C0A321

Triadic

BE5220

21C053

5321C0

Split-Comp.

BE5220

21C0A3

213EC0

Tetradic

BE5220

3EC021

218DC0

A321C0

Contrast Matrix WCAG 2.1 Contrast

BE5220	AA3A22	5C2826	1E113A	313851
—	1.3 Fail	2.5 Fail	3.7 AA Large	2.4 Fail
1.3 Fail	—	1.9 Fail	2.8 Fail	1.8 Fail
2.5 Fail	1.9 Fail	—	1.5 Fail	1.0 Fail
3.7 AA Large	2.8 Fail	1.5 Fail	—	1.5 Fail
2.4 Fail	1.8 Fail	1.0 Fail	1.5 Fail	—

White BG

4.8AA

6.3AA

11.8AAA

17.6AAA

11.6AAA

Black BG

4.4AA Large

3.3AA Large

1.8Fail

1.2Fail

1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8F8E2C

7A7828

454526

181830

34344B

Deuteranopia

969E2F

808829

494C27

191A2E

34334A

Tritanopia

B93638

A42C2D

592727

1D2827

314645

Achromatopsia

6D6D6D

595959

373737

1A1A1A

393939

Shades & Tints Shades & Tints

#BE5220

Dark

Light

#AA3A22

Dark

Light

#5C2826

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #be5220;
  --color-2: #aa3a22;
  --color-3: #5c2826;
  --color-4: #1e113a;
  --color-5: #313851;
}

SCSS

$color-1: #be5220;
$color-2: #aa3a22;
$color-3: #5c2826;
$color-4: #1e113a;
$color-5: #313851;

TAILWIND

colors: {
  'brand-1': '#be5220',
  'brand-2': '#aa3a22',
  'brand-3': '#5c2826',
  'brand-4': '#1e113a',
  'brand-5': '#313851',
}

RGB Array

[190, 82, 32], [170, 58, 34], [92, 40, 38], [30, 17, 58], [49, 56, 81]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #BE5220, #AA3A22, #5C2826, #1E113A, #313851 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: #be5220; --color-2: #aa3a22; --color-3: #5c2826; --color-4: #1e113a; --color-5: #313851. 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 space-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