← Back to Editor

#FF9A36 · #F44645 · #D42A5A · #7A1A6C · #152B40

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

#FF9A36

Ginger · Coral · Warm Sun

HEX
#FF9A36
RGB
rgb(255, 154, 54)
HSL
hsl(30, 100%, 61%)
HSB
hsb(30, 79%, 100%)
CMYK
cmyk(0%, 40%, 79%, 0%)
Oklch
oklch(77.6% 0.161 60.3)

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

#F44645

Peach Pink · Tomato · Coral Red

HEX
#F44645
RGB
rgb(244, 70, 69)
HSL
hsl(0, 89%, 61%)
HSB
hsb(0, 72%, 96%)
CMYK
cmyk(0%, 71%, 72%, 4%)
Oklch
oklch(64.7% 0.211 25.6)

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

#D42A5A

Dark Violet · Crimson · Camellia

HEX
#D42A5A
RGB
rgb(212, 42, 90)
HSL
hsl(343, 67%, 50%)
HSB
hsb(343, 80%, 83%)
CMYK
cmyk(0%, 80%, 58%, 17%)
Oklch
oklch(57.3% 0.204 11.0)

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

#7A1A6C

Rose Purple · Purple · Eggplant

HEX
#7A1A6C
RGB
rgb(122, 26, 108)
HSL
hsl(309, 65%, 29%)
HSB
hsb(309, 79%, 48%)
CMYK
cmyk(0%, 79%, 11%, 52%)
Oklch
oklch(41.2% 0.158 334.8)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#152B40

Lake Blue · DarkSlateGray · Deep Sea Blue

HEX
#152B40
RGB
rgb(21, 43, 64)
HSL
hsl(209, 51%, 17%)
HSB
hsb(209, 67%, 25%)
CMYK
cmyk(67%, 33%, 0%, 75%)
Oklch
oklch(28.2% 0.048 248.9)

Traditional「Lake Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF9A36
389CFF

Analogous

FF3838
FF9A36
FFFF38

Triadic

FF9A36
38FF9C
9C38FF

Split-Comp.

FF9A36
38FFFF
3838FF

Tetradic

FF9A36
38FF38
389CFF
FF38FF

Contrast Matrix WCAG 2.1 Contrast

FF9A36
F44645
D42A5A
7A1A6C
152B40
—
1.7
Fail
2.3
Fail
4.5
AA
6.8
AA
1.7
Fail
—
1.4
Fail
2.7
Fail
4.0
AA Large
2.3
Fail
1.4
Fail
—
2.0
Fail
2.9
Fail
4.5
AA
2.7
Fail
2.0
Fail
—
1.5
Fail
6.8
AA
4.0
AA Large
2.9
Fail
1.5
Fail
—
White BG
2.1Fail
3.6AA Large
4.9AA
9.6AAA
14.5AAA
Black BG
9.9AAA
5.8AA
4.3AA Large
2.2Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D24E
A9A745
8A894E
505058
1F1F3B

Deuteranopia

D9E154
B3C045
94A14C
565D53
1D1C3A

Tritanopia

FA6166
EB4545
CB4543
754845
163736

Achromatopsia

ADADAD
7A7A7A
626262
404040
272727

Shades & Tints Shades & Tints

#FF9A36

Dark
Light

#F44645

Dark
Light

#D42A5A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff9a36;
  --color-2: #f44645;
  --color-3: #d42a5a;
  --color-4: #7a1a6c;
  --color-5: #152b40;
}

SCSS

$color-1: #ff9a36;
$color-2: #f44645;
$color-3: #d42a5a;
$color-4: #7a1a6c;
$color-5: #152b40;

TAILWIND

colors: {
  'brand-1': '#ff9a36',
  'brand-2': '#f44645',
  'brand-3': '#d42a5a',
  'brand-4': '#7a1a6c',
  'brand-5': '#152b40',
}

RGB Array

[255, 154, 54], [244, 70, 69], [212, 42, 90], [122, 26, 108], [21, 43, 64]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF9A36, #F44645, #D42A5A, #7A1A6C, #152B40 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: #ff9a36; --color-2: #f44645; --color-3: #d42a5a; --color-4: #7a1a6c; --color-5: #152b40. 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