← Back to Editor

#FF4E3E · #57433A · #472E27 · #FEA261 · #1B100E

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

#FF4E3E

Peach Pink · Tomato · Coral Red

HEX
#FF4E3E
RGB
rgb(255, 78, 62)
HSL
hsl(5, 100%, 62%)
HSB
hsb(5, 76%, 100%)
CMYK
cmyk(0%, 69%, 76%, 0%)
Oklch
oklch(67.2% 0.216 29.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#57433A

Tangerine · DarkOliveGreen · Amber Brown

HEX
#57433A
RGB
rgb(87, 67, 58)
HSL
hsl(19, 20%, 28%)
HSB
hsb(19, 33%, 34%)
CMYK
cmyk(0%, 23%, 33%, 66%)
Oklch
oklch(40.2% 0.032 45.4)

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

#472E27

Crimson · DarkSlateGray · Wine Red

HEX
#472E27
RGB
rgb(71, 46, 39)
HSL
hsl(13, 29%, 22%)
HSB
hsb(13, 45%, 28%)
CMYK
cmyk(0%, 35%, 45%, 72%)
Oklch
oklch(32.9% 0.039 36.3)

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

#FEA261

Apricot · SandyBrown · Warm Sun

HEX
#FEA261
RGB
rgb(254, 162, 97)
HSL
hsl(25, 99%, 69%)
HSB
hsb(25, 62%, 100%)
CMYK
cmyk(0%, 36%, 62%, 0%)
Oklch
oklch(79.2% 0.136 54.6)

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

#1B100E

Crimson · Black · Deep Berry

HEX
#1B100E
RGB
rgb(27, 16, 14)
HSL
hsl(9, 32%, 8%)
HSB
hsb(9, 48%, 11%)
CMYK
cmyk(0%, 41%, 48%, 89%)
Oklch
oklch(18.7% 0.019 30.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF4E3E
3DEFFF

Analogous

FF3D8E
FF4E3E
FFAE3D

Triadic

FF4E3E
3DFF4D
4D3DFF

Split-Comp.

FF4E3E
3DFFAE
3D8EFF

Tetradic

FF4E3E
8EFF3D
3DEFFF
AE3DFF

Contrast Matrix WCAG 2.1 Contrast

FF4E3E
57433A
472E27
FEA261
1B100E
—
2.8
Fail
3.8
AA Large
1.6
Fail
5.7
AA
2.8
Fail
—
1.3
Fail
4.7
AA
2.0
Fail
3.8
AA Large
1.3
Fail
—
6.3
AA
1.5
Fail
1.6
Fail
4.7
AA
6.3
AA
—
9.4
AAA
5.7
AA
2.0
Fail
1.5
Fail
9.4
AAA
—
White BG
3.3AA Large
9.3AAA
12.4AAA
2.0Fail
18.6AAA
Black BG
6.4AA
2.3Fail
1.7Fail
10.6AAA
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B2B142
4E4E3C
3C3C29
D6D571
16160E

Deuteranopia

BDCA43
50513D
3E3F29
DCE275
17180F

Tritanopia

F64546
563E3E
462A2A
F97D80
1A0F0F

Achromatopsia

818181
484848
353535
B6B6B6
131313

Shades & Tints Shades & Tints

#FF4E3E

Dark
Light

#57433A

Dark
Light

#472E27

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff4e3e;
  --color-2: #57433a;
  --color-3: #472e27;
  --color-4: #fea261;
  --color-5: #1b100e;
}

SCSS

$color-1: #ff4e3e;
$color-2: #57433a;
$color-3: #472e27;
$color-4: #fea261;
$color-5: #1b100e;

TAILWIND

colors: {
  'brand-1': '#ff4e3e',
  'brand-2': '#57433a',
  'brand-3': '#472e27',
  'brand-4': '#fea261',
  'brand-5': '#1b100e',
}

RGB Array

[255, 78, 62], [87, 67, 58], [71, 46, 39], [254, 162, 97], [27, 16, 14]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF4E3E, #57433A, #472E27, #FEA261, #1B100E is ideal for: tech websites, dark mode UIs, game UIs, 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: #ff4e3e; --color-2: #57433a; --color-3: #472e27; --color-4: #fea261; --color-5: #1b100e. 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 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