← Back to Editor

#3E3E60 · #7D5E64 · #010000 · #FA8C00 · #FB9D5F

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

#3E3E60

Deep Indigo · DarkSlateGray · Prussian Blue

HEX
#3E3E60
RGB
rgb(62, 62, 96)
HSL
hsl(240, 22%, 31%)
HSB
hsb(240, 35%, 38%)
CMYK
cmyk(35%, 35%, 0%, 62%)
Oklch
oklch(37.9% 0.058 283.3)

Traditional「Deep Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#7D5E64

Crimson · DimGray · Passion Red

HEX
#7D5E64
RGB
rgb(125, 94, 100)
HSL
hsl(348, 14%, 43%)
HSB
hsb(348, 25%, 49%)
CMYK
cmyk(0%, 25%, 20%, 51%)
Oklch
oklch(51.5% 0.041 5.7)

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

#010000

Vermilion · Black · Deep Berry

HEX
#010000
RGB
rgb(1, 0, 0)
HSL
hsl(0, 100%, 0%)
HSB
hsb(0, 100%, 0%)
CMYK
cmyk(0%, 100%, 100%, 100%)
Oklch
oklch(4.2% 0.017 29.2)

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

#FA8C00

Ochre · Orange · Amber Brown

HEX
#FA8C00
RGB
rgb(250, 140, 0)
HSL
hsl(34, 100%, 49%)
HSB
hsb(34, 100%, 98%)
CMYK
cmyk(0%, 44%, 100%, 2%)
Oklch
oklch(74.4% 0.175 59.6)

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

#FB9D5F

Apricot · SandyBrown · Warm Sun

HEX
#FB9D5F
RGB
rgb(251, 157, 95)
HSL
hsl(24, 95%, 68%)
HSB
hsb(24, 62%, 98%)
CMYK
cmyk(0%, 37%, 62%, 2%)
Oklch
oklch(78.0% 0.137 52.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3E3E60
60603E

Analogous

3E4F60
3E3E60
4F3E60

Triadic

3E3E60
603E3E
3E603E

Split-Comp.

3E3E60
604F3E
4F603E

Tetradic

3E3E60
603E4F
60603E
3E604F

Contrast Matrix WCAG 2.1 Contrast

3E3E60
7D5E64
010000
FA8C00
FB9D5F
—
1.8
Fail
2.1
Fail
4.3
AA Large
4.9
AA
1.8
Fail
—
3.7
AA Large
2.4
Fail
2.8
Fail
2.1
Fail
3.7
AA Large
—
8.8
AAA
10.1
AAA
4.3
AA Large
2.4
Fail
8.8
AAA
—
1.1
Fail
4.9
AA
2.8
Fail
10.1
AAA
1.1
Fail
—
White BG
10.2AAA
5.7AA
21.0AAA
2.4Fail
2.1Fail
Black BG
2.1Fail
3.7AA Large
1.0Fail
8.8AAA
10.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3E3E58
706F63
010100
CAC922
D2D16E

Deuteranopia

3E3E56
717462
010100
D1D92A
D8DF72

Tritanopia

3E5150
7B6161
010000
F53D43
F67A7C

Achromatopsia

424242
686868
000000
9D9D9D
B2B2B2

Shades & Tints Shades & Tints

#3E3E60

Dark
Light

#7D5E64

Dark
Light

#010000

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3e3e60;
  --color-2: #7d5e64;
  --color-3: #010000;
  --color-4: #fa8c00;
  --color-5: #fb9d5f;
}

SCSS

$color-1: #3e3e60;
$color-2: #7d5e64;
$color-3: #010000;
$color-4: #fa8c00;
$color-5: #fb9d5f;

TAILWIND

colors: {
  'brand-1': '#3e3e60',
  'brand-2': '#7d5e64',
  'brand-3': '#010000',
  'brand-4': '#fa8c00',
  'brand-5': '#fb9d5f',
}

RGB Array

[62, 62, 96], [125, 94, 100], [1, 0, 0], [250, 140, 0], [251, 157, 95]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3E3E60, #7D5E64, #010000, #FA8C00, #FB9D5F 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: #3e3e60; --color-2: #7d5e64; --color-3: #010000; --color-4: #fa8c00; --color-5: #fb9d5f. 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