← Back to Editor

#826851 · #E4244D · #EF9A75 · #B82339 · #301D16

A 5-color palette 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

#826851

Tangerine · DimGray · Amber Brown

HEX
#826851
RGB
rgb(130, 104, 81)
HSL
hsl(28, 23%, 41%)
HSB
hsb(28, 38%, 51%)
CMYK
cmyk(0%, 20%, 38%, 49%)
Oklch
oklch(53.7% 0.048 63.0)

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

#E4244D

Vermilion · Crimson · Passion Red

HEX
#E4244D
RGB
rgb(228, 36, 77)
HSL
hsl(347, 78%, 52%)
HSB
hsb(347, 84%, 89%)
CMYK
cmyk(0%, 84%, 66%, 11%)
Oklch
oklch(59.6% 0.221 16.9)

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

#EF9A75

Apricot · DarkSalmon · Warm Sun

HEX
#EF9A75
RGB
rgb(239, 154, 117)
HSL
hsl(18, 79%, 70%)
HSB
hsb(18, 51%, 94%)
CMYK
cmyk(0%, 36%, 51%, 6%)
Oklch
oklch(76.4% 0.114 44.1)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#B82339

Vermilion · FireBrick · Passion Red

HEX
#B82339
RGB
rgb(184, 35, 57)
HSL
hsl(351, 68%, 43%)
HSB
hsb(351, 81%, 72%)
CMYK
cmyk(0%, 81%, 69%, 28%)
Oklch
oklch(51.2% 0.183 19.5)

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

#301D16

Tangerine · Black · Cinnamon

HEX
#301D16
RGB
rgb(48, 29, 22)
HSL
hsl(16, 37%, 14%)
HSB
hsb(16, 54%, 19%)
CMYK
cmyk(0%, 40%, 54%, 81%)
Oklch
oklch(25.3% 0.033 41.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

826851
516A81

Analogous

815152
826851
817F51

Triadic

826851
518167
675181

Split-Comp.

826851
51817F
515281

Tetradic

826851
528151
516A81
7F5181

Contrast Matrix WCAG 2.1 Contrast

826851
E4244D
EF9A75
B82339
301D16
—
1.2
Fail
2.4
Fail
1.2
Fail
3.1
AA Large
1.2
Fail
—
2.0
Fail
1.4
Fail
3.5
AA Large
2.4
Fail
2.0
Fail
—
2.9
Fail
7.3
AAA
1.2
Fail
1.4
Fail
2.9
Fail
—
2.5
Fail
3.1
AA Large
3.5
AA Large
7.3
AAA
2.5
Fail
—
White BG
5.2AA
4.5AA
2.2Fail
6.3AA
16.0AAA
Black BG
4.0AA Large
4.7AA
9.5AAA
3.3AA Large
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

777757
918F43
CAC97E
777634
282818

Deuteranopia

787A58
9CAA41
CFD580
808B32
292A18

Tritanopia

815B5C
DA3B3A
EB8587
B12F2F
2F1919

Achromatopsia

6D6D6D
626262
AFAFAF
525252
222222

Shades & Tints Shades & Tints

#826851

Dark
Light

#E4244D

Dark
Light

#EF9A75

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #826851;
  --color-2: #e4244d;
  --color-3: #ef9a75;
  --color-4: #b82339;
  --color-5: #301d16;
}

SCSS

$color-1: #826851;
$color-2: #e4244d;
$color-3: #ef9a75;
$color-4: #b82339;
$color-5: #301d16;

TAILWIND

colors: {
  'brand-1': '#826851',
  'brand-2': '#e4244d',
  'brand-3': '#ef9a75',
  'brand-4': '#b82339',
  'brand-5': '#301d16',
}

RGB Array

[130, 104, 81], [228, 36, 77], [239, 154, 117], [184, 35, 57], [48, 29, 22]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #826851, #E4244D, #EF9A75, #B82339, #301D16 is ideal for: 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: #826851; --color-2: #e4244d; --color-3: #ef9a75; --color-4: #b82339; --color-5: #301d16. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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