← Back to Editor

#044542 · #B58B38 · #E83535 · #7A2D2D · #87004D

bright

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#044542

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#044542
RGB
rgb(4, 69, 66)
HSL
hsl(177, 89%, 14%)
HSB
hsb(177, 94%, 27%)
CMYK
cmyk(94%, 0%, 4%, 73%)
Oklch
oklch(35.3% 0.059 189.8)

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

#B58B38

Ochre · DarkGoldenRod · Honey Gold

HEX
#B58B38
RGB
rgb(181, 139, 56)
HSL
hsl(40, 53%, 46%)
HSB
hsb(40, 69%, 71%)
CMYK
cmyk(0%, 23%, 69%, 29%)
Oklch
oklch(66.1% 0.112 81.5)

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

#E83535

Vermilion · Crimson · Passion Red

HEX
#E83535
RGB
rgb(232, 53, 53)
HSL
hsl(0, 80%, 56%)
HSB
hsb(0, 77%, 91%)
CMYK
cmyk(0%, 77%, 77%, 9%)
Oklch
oklch(61.0% 0.215 26.4)

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

#7A2D2D

Crimson · Brown · Wine Red

HEX
#7A2D2D
RGB
rgb(122, 45, 45)
HSL
hsl(0, 46%, 33%)
HSB
hsb(0, 63%, 48%)
CMYK
cmyk(0%, 63%, 63%, 52%)
Oklch
oklch(40.9% 0.108 23.1)

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

#87004D

Rose Purple · Purple · Camellia

HEX
#87004D
RGB
rgb(135, 0, 77)
HSL
hsl(326, 100%, 26%)
HSB
hsb(326, 100%, 53%)
CMYK
cmyk(0%, 100%, 43%, 47%)
Oklch
oklch(40.7% 0.167 355.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

044542
430407

Analogous

044321
044542
042743

Triadic

044542
400443
434004

Split-Comp.

044542
430427
432104

Tetradic

044542
210443
430407
274304

Contrast Matrix WCAG 2.1 Contrast

044542
B58B38
E83535
7A2D2D
87004D
—
3.5
AA Large
2.6
Fail
1.2
Fail
1.1
Fail
3.5
AA Large
—
1.3
Fail
3.0
Fail
3.1
AA Large
2.6
Fail
1.3
Fail
—
2.2
Fail
2.3
Fail
1.2
Fail
3.0
Fail
2.2
Fail
—
1.0
Fail
1.1
Fail
3.1
AA Large
2.3
Fail
1.0
Fail
—
White BG
10.9AAA
3.1AA Large
4.2AA Large
9.4AAA
9.8AAA
Black BG
1.9Fail
6.7AA
5.0AA
2.2Fail
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

202143
A3A24C
9A9935
59582D
4D4B3A

Deuteranopia

1C1843
A5A851
A5B235
5D632D
545F36

Tritanopia

074343
B35C5F
DF3535
762D2D
802C28

Achromatopsia

313131
8E8E8E
6B6B6B
444444
313131

Shades & Tints Shades & Tints

#044542

Dark
Light

#B58B38

Dark
Light

#E83535

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #044542;
  --color-2: #b58b38;
  --color-3: #e83535;
  --color-4: #7a2d2d;
  --color-5: #87004d;
}

SCSS

$color-1: #044542;
$color-2: #b58b38;
$color-3: #e83535;
$color-4: #7a2d2d;
$color-5: #87004d;

TAILWIND

colors: {
  'brand-1': '#044542',
  'brand-2': '#b58b38',
  'brand-3': '#e83535',
  'brand-4': '#7a2d2d',
  'brand-5': '#87004d',
}

RGB Array

[4, 69, 66], [181, 139, 56], [232, 53, 53], [122, 45, 45], [135, 0, 77]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #044542, #B58B38, #E83535, #7A2D2D, #87004D is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #044542; --color-2: #b58b38; --color-3: #e83535; --color-4: #7a2d2d; --color-5: #87004d. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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