← Back to Editor

#7589E2 · #2E3639 · #FCDF5F · #FB5B39 · #C6412E

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

#7589E2

Azure · CornflowerBlue · Cobalt Blue

HEX
#7589E2
RGB
rgb(117, 137, 226)
HSL
hsl(229, 65%, 67%)
HSB
hsb(229, 48%, 89%)
CMYK
cmyk(48%, 39%, 0%, 11%)
Oklch
oklch(65.4% 0.135 272.6)

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

#2E3639

Slate Blue · DarkSlateGray · Peacock Green

HEX
#2E3639
RGB
rgb(46, 54, 57)
HSL
hsl(196, 11%, 20%)
HSB
hsb(196, 19%, 22%)
CMYK
cmyk(19%, 5%, 0%, 78%)
Oklch
oklch(32.7% 0.012 222.4)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#FCDF5F

Ginger · Khaki · Sunflower

HEX
#FCDF5F
RGB
rgb(252, 223, 95)
HSL
hsl(49, 96%, 68%)
HSB
hsb(49, 62%, 99%)
CMYK
cmyk(0%, 12%, 62%, 1%)
Oklch
oklch(90.4% 0.148 96.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#FB5B39

Vermilion · Tomato · Passion Red

HEX
#FB5B39
RGB
rgb(251, 91, 57)
HSL
hsl(11, 96%, 60%)
HSB
hsb(11, 77%, 98%)
CMYK
cmyk(0%, 64%, 77%, 2%)
Oklch
oklch(67.9% 0.201 33.7)

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

#C6412E

Vermilion · FireBrick · Passion Red

HEX
#C6412E
RGB
rgb(198, 65, 46)
HSL
hsl(7, 62%, 48%)
HSB
hsb(7, 77%, 78%)
CMYK
cmyk(0%, 67%, 77%, 22%)
Oklch
oklch(56.3% 0.172 31.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7589E2
E2CD74

Analogous

74BFE2
7589E2
9774E2

Triadic

7589E2
E27488
88E274

Split-Comp.

7589E2
E29774
BFE274

Tetradic

7589E2
E274BF
E2CD74
74E297

Contrast Matrix WCAG 2.1 Contrast

7589E2
2E3639
FCDF5F
FB5B39
C6412E
—
3.8
AA Large
2.5
Fail
1.0
Fail
1.5
Fail
3.8
AA Large
—
9.3
AAA
3.9
AA Large
2.5
Fail
2.5
Fail
9.3
AAA
—
2.4
Fail
3.8
AA Large
1.0
Fail
3.9
AA Large
2.4
Fail
—
1.6
Fail
1.5
Fail
2.5
Fail
3.8
AA Large
1.6
Fail
—
White BG
3.3AA Large
12.3AAA
1.3Fail
3.2AA Large
5.0AA
Black BG
6.4AA
1.7Fail
15.9AAA
6.7AA
4.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

7E7ECC
313238
EFEF7E
B6B441
8C8B33

Deuteranopia

7D7BC7
313038
F1F385
BFCB43
949E34

Tritanopia

76BBB8
2E3838
FB969C
F34849
BF3637

Achromatopsia

8D8D8D
343434
D9D9D9
878787
676767

Shades & Tints Shades & Tints

#7589E2

Dark
Light

#2E3639

Dark
Light

#FCDF5F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7589e2;
  --color-2: #2e3639;
  --color-3: #fcdf5f;
  --color-4: #fb5b39;
  --color-5: #c6412e;
}

SCSS

$color-1: #7589e2;
$color-2: #2e3639;
$color-3: #fcdf5f;
$color-4: #fb5b39;
$color-5: #c6412e;

TAILWIND

colors: {
  'brand-1': '#7589e2',
  'brand-2': '#2e3639',
  'brand-3': '#fcdf5f',
  'brand-4': '#fb5b39',
  'brand-5': '#c6412e',
}

RGB Array

[117, 137, 226], [46, 54, 57], [252, 223, 95], [251, 91, 57], [198, 65, 46]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7589E2, #2E3639, #FCDF5F, #FB5B39, #C6412E is ideal for: social media posters, mobile apps, e-commerce promos, 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: #7589e2; --color-2: #2e3639; --color-3: #fcdf5f; --color-4: #fb5b39; --color-5: #c6412e. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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