← Back to Editor

#FA2B2B · #D1734B · #7E7853 · #3B3224 · #25040E

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

#FA2B2B

Vermilion · Crimson · Passion Red

HEX
#FA2B2B
RGB
rgb(250, 43, 43)
HSL
hsl(0, 95%, 57%)
HSB
hsb(0, 83%, 98%)
CMYK
cmyk(0%, 83%, 83%, 2%)
Oklch
oklch(63.4% 0.238 27.4)

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

#D1734B

Tangerine · Chocolate · Warm Sun

HEX
#D1734B
RGB
rgb(209, 115, 75)
HSL
hsl(18, 59%, 56%)
HSB
hsb(18, 64%, 82%)
CMYK
cmyk(0%, 45%, 64%, 18%)
Oklch
oklch(65.3% 0.130 43.1)

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

#7E7853

Autumn Sage · DimGray · Honey Gold

HEX
#7E7853
RGB
rgb(126, 120, 83)
HSL
hsl(52, 21%, 41%)
HSB
hsb(52, 34%, 49%)
CMYK
cmyk(0%, 5%, 34%, 51%)
Oklch
oklch(56.8% 0.054 100.1)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#3B3224

Ochre · DarkSlateGray · Cinnamon

HEX
#3B3224
RGB
rgb(59, 50, 36)
HSL
hsl(37, 24%, 19%)
HSB
hsb(37, 39%, 23%)
CMYK
cmyk(0%, 15%, 39%, 77%)
Oklch
oklch(32.3% 0.027 78.6)

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

#25040E

Dark Violet · Black · Raspberry

HEX
#25040E
RGB
rgb(37, 4, 14)
HSL
hsl(342, 80%, 8%)
HSB
hsb(342, 89%, 15%)
CMYK
cmyk(0%, 89%, 62%, 85%)
Oklch
oklch(18.0% 0.058 5.1)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FA2B2B
29FAFA

Analogous

FA2991
FA2B2B
FA9129

Triadic

FA2B2B
29FA29
2929FA

Split-Comp.

FA2B2B
29FA91
2991FA

Tetradic

FA2B2B
91FA29
29FAFA
9129FA

Contrast Matrix WCAG 2.1 Contrast

FA2B2B
D1734B
7E7853
3B3224
25040E
—
1.2
Fail
1.2
Fail
3.3
AA Large
4.9
AA
1.2
Fail
—
1.3
Fail
3.8
AA Large
5.7
AA
1.2
Fail
1.3
Fail
—
2.8
Fail
4.3
AA Large
3.3
AA Large
3.8
AA Large
2.8
Fail
—
1.5
Fail
4.9
AA
5.7
AA
4.3
AA Large
1.5
Fail
—
White BG
3.9AA Large
3.4AA Large
4.5AA Large
12.6AAA
19.0AAA
Black BG
5.4AA
6.3AA
4.7AA
1.7Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A09F2B
A8A755
7B7B5C
373727
17160C

Deuteranopia

ACBC2B
AEB557
7C7C5E
383828
191B0B

Tritanopia

F02B2B
CC5C5E
7E6365
3B2A2B
230A09

Achromatopsia

696969
8B8B8B
767676
333333
0F0F0F

Shades & Tints Shades & Tints

#FA2B2B

Dark
Light

#D1734B

Dark
Light

#7E7853

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fa2b2b;
  --color-2: #d1734b;
  --color-3: #7e7853;
  --color-4: #3b3224;
  --color-5: #25040e;
}

SCSS

$color-1: #fa2b2b;
$color-2: #d1734b;
$color-3: #7e7853;
$color-4: #3b3224;
$color-5: #25040e;

TAILWIND

colors: {
  'brand-1': '#fa2b2b',
  'brand-2': '#d1734b',
  'brand-3': '#7e7853',
  'brand-4': '#3b3224',
  'brand-5': '#25040e',
}

RGB Array

[250, 43, 43], [209, 115, 75], [126, 120, 83], [59, 50, 36], [37, 4, 14]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FA2B2B, #D1734B, #7E7853, #3B3224, #25040E 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: #fa2b2b; --color-2: #d1734b; --color-3: #7e7853; --color-4: #3b3224; --color-5: #25040e. 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