← Back to Editor

#FF4B19 · #E32817 · #3B311D · #2F6E48 · #2BAB9A

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 App

Color Details Color Details

#FF4B19

Vermilion · OrangeRed · Passion Red

HEX
#FF4B19
RGB
rgb(255, 75, 25)
HSL
hsl(13, 100%, 55%)
HSB
hsb(13, 90%, 100%)
CMYK
cmyk(0%, 71%, 90%, 0%)
Oklch
oklch(66.6% 0.223 34.9)

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

#E32817

Vermilion · Crimson · Passion Red

HEX
#E32817
RGB
rgb(227, 40, 23)
HSL
hsl(5, 82%, 49%)
HSB
hsb(5, 90%, 89%)
CMYK
cmyk(0%, 82%, 90%, 11%)
Oklch
oklch(59.0% 0.222 30.1)

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

#3B311D

Ochre · DarkSlateGray · Amber Gold

HEX
#3B311D
RGB
rgb(59, 49, 29)
HSL
hsl(40, 34%, 17%)
HSB
hsb(40, 51%, 23%)
CMYK
cmyk(0%, 17%, 51%, 77%)
Oklch
oklch(31.8% 0.035 84.0)

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

#2F6E48

Celadon · DarkSlateGray · Forest Green

HEX
#2F6E48
RGB
rgb(47, 110, 72)
HSL
hsl(144, 40%, 31%)
HSB
hsb(144, 57%, 43%)
CMYK
cmyk(57%, 0%, 35%, 57%)
Oklch
oklch(48.6% 0.090 154.6)

Traditional「Celadon」· Paint「Forest Green」· Creative Blush Sunrise

#2BAB9A

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#2BAB9A
RGB
rgb(43, 171, 154)
HSL
hsl(172, 60%, 42%)
HSB
hsb(172, 75%, 67%)
CMYK
cmyk(75%, 0%, 10%, 33%)
Oklch
oklch(67.0% 0.110 181.8)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF4B19
1ACDFF

Analogous

FF1A5B
FF4B19
FFBE1A

Triadic

FF4B19
1AFF4B
4B1AFF

Split-Comp.

FF4B19
1AFFBE
1A5BFF

Tetradic

FF4B19
5BFF1A
1ACDFF
BE1AFF

Contrast Matrix WCAG 2.1 Contrast

FF4B19
E32817
3B311D
2F6E48
2BAB9A
—
1.4
Fail
3.8
AA Large
1.8
Fail
1.2
Fail
1.4
Fail
—
2.8
Fail
1.3
Fail
1.6
Fail
3.8
AA Large
2.8
Fail
—
2.1
Fail
4.5
AA
1.8
Fail
1.3
Fail
2.1
Fail
—
2.1
Fail
1.2
Fail
1.6
Fail
4.5
AA
2.1
Fail
—
White BG
3.3AA Large
4.6AA
12.8AAA
6.1AA
2.8Fail
Black BG
6.3AA
4.6AA
1.6Fail
3.4AA Large
7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B1AF25
92901B
373722
4A4B51
62649E

Deuteranopia

BCC928
9DAB1C
373823
474253
5B519F

Tritanopia

F62F31
DA1E1F
3B2627
32585A
31A1A2

Achromatopsia

7B7B7B
5E5E5E
323232
575757
838383

Shades & Tints Shades & Tints

#FF4B19

Dark
Light

#E32817

Dark
Light

#3B311D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff4b19;
  --color-2: #e32817;
  --color-3: #3b311d;
  --color-4: #2f6e48;
  --color-5: #2bab9a;
}

SCSS

$color-1: #ff4b19;
$color-2: #e32817;
$color-3: #3b311d;
$color-4: #2f6e48;
$color-5: #2bab9a;

TAILWIND

colors: {
  'brand-1': '#ff4b19',
  'brand-2': '#e32817',
  'brand-3': '#3b311d',
  'brand-4': '#2f6e48',
  'brand-5': '#2bab9a',
}

RGB Array

[255, 75, 25], [227, 40, 23], [59, 49, 29], [47, 110, 72], [43, 171, 154]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF4B19, #E32817, #3B311D, #2F6E48, #2BAB9A is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. 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: #ff4b19; --color-2: #e32817; --color-3: #3b311d; --color-4: #2f6e48; --color-5: #2bab9a. 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 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