← Back to Editor

#E27731 · #A6220D · #261207 · #4D0E07 · #9FB4ED

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

#E27731

Tangerine · Chocolate · Warm Sun

HEX
#E27731
RGB
rgb(226, 119, 49)
HSL
hsl(24, 75%, 54%)
HSB
hsb(24, 78%, 89%)
CMYK
cmyk(0%, 47%, 78%, 11%)
Oklch
oklch(68.0% 0.155 50.0)

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

#A6220D

Vermilion · FireBrick · Wine Red

HEX
#A6220D
RGB
rgb(166, 34, 13)
HSL
hsl(8, 85%, 35%)
HSB
hsb(8, 92%, 65%)
CMYK
cmyk(0%, 80%, 92%, 35%)
Oklch
oklch(47.3% 0.171 31.7)

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

#261207

Tangerine · Black · Cinnamon

HEX
#261207
RGB
rgb(38, 18, 7)
HSL
hsl(21, 69%, 9%)
HSB
hsb(21, 82%, 15%)
CMYK
cmyk(0%, 53%, 82%, 85%)
Oklch
oklch(20.8% 0.039 49.0)

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

#4D0E07

Vermilion · Maroon · Deep Berry

HEX
#4D0E07
RGB
rgb(77, 14, 7)
HSL
hsl(6, 83%, 16%)
HSB
hsb(6, 91%, 30%)
CMYK
cmyk(0%, 82%, 91%, 70%)
Oklch
oklch(27.8% 0.095 30.5)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#9FB4ED

Azure · LightSteelBlue · Cobalt Blue

HEX
#9FB4ED
RGB
rgb(159, 180, 237)
HSL
hsl(224, 68%, 78%)
HSB
hsb(224, 33%, 93%)
CMYK
cmyk(33%, 24%, 0%, 7%)
Oklch
oklch(77.5% 0.085 268.7)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E27731
329BE2

Analogous

E23243
E27731
E2D032

Triadic

E27731
32E278
7832E2

Split-Comp.

E27731
32E2D0
3243E2

Tetradic

E27731
43E232
329BE2
D032E2

Contrast Matrix WCAG 2.1 Contrast

E27731
A6220D
261207
4D0E07
9FB4ED
—
2.4
Fail
5.9
AA
5.0
AA
1.5
Fail
2.4
Fail
—
2.4
Fail
2.1
Fail
3.6
AA Large
5.9
AA
2.4
Fail
—
1.2
Fail
8.7
AAA
5.0
AA
2.1
Fail
1.2
Fail
—
7.4
AAA
1.5
Fail
3.6
AA Large
8.7
AAA
7.4
AAA
—
White BG
3.0AA Large
7.4AAA
17.9AAA
15.2AAA
2.1Fail
Black BG
6.9AA
2.9Fail
1.2Fail
1.4Fail
10.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B342
6D6C12
1D1D0A
323109
A8A8DF

Deuteranopia

BAC246
757E13
1F200A
353A09
A7A5DC

Tritanopia

DD4F52
9F1617
250C0C
4A0A0A
A0D4D2

Achromatopsia

8F8F8F
474747
171717
202020
B4B4B4

Shades & Tints Shades & Tints

#E27731

Dark
Light

#A6220D

Dark
Light

#261207

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e27731;
  --color-2: #a6220d;
  --color-3: #261207;
  --color-4: #4d0e07;
  --color-5: #9fb4ed;
}

SCSS

$color-1: #e27731;
$color-2: #a6220d;
$color-3: #261207;
$color-4: #4d0e07;
$color-5: #9fb4ed;

TAILWIND

colors: {
  'brand-1': '#e27731',
  'brand-2': '#a6220d',
  'brand-3': '#261207',
  'brand-4': '#4d0e07',
  'brand-5': '#9fb4ed',
}

RGB Array

[226, 119, 49], [166, 34, 13], [38, 18, 7], [77, 14, 7], [159, 180, 237]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E27731, #A6220D, #261207, #4D0E07, #9FB4ED 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: #e27731; --color-2: #a6220d; --color-3: #261207; --color-4: #4d0e07; --color-5: #9fb4ed. 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 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