← Back to Editor

#F75D23 · #BB2115 · #A6195F · #45141F · #8FA4BF

sunset

A 5-color sunset 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

#F75D23

Tangerine · Tomato · Warm Sun

HEX
#F75D23
RGB
rgb(247, 93, 35)
HSL
hsl(16, 93%, 55%)
HSB
hsb(16, 86%, 97%)
CMYK
cmyk(0%, 62%, 86%, 3%)
Oklch
oklch(67.3% 0.200 38.7)

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

#BB2115

Vermilion · FireBrick · Passion Red

HEX
#BB2115
RGB
rgb(187, 33, 21)
HSL
hsl(4, 80%, 41%)
HSB
hsb(4, 89%, 73%)
CMYK
cmyk(0%, 82%, 89%, 27%)
Oklch
oklch(51.2% 0.190 29.7)

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

#A6195F

Dark Violet · MediumVioletRed · Camellia

HEX
#A6195F
RGB
rgb(166, 25, 95)
HSL
hsl(330, 74%, 37%)
HSB
hsb(330, 85%, 65%)
CMYK
cmyk(0%, 85%, 43%, 35%)
Oklch
oklch(48.2% 0.181 357.3)

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

#45141F

Crimson · Maroon · Deep Berry

HEX
#45141F
RGB
rgb(69, 20, 31)
HSL
hsl(347, 55%, 17%)
HSB
hsb(347, 71%, 27%)
CMYK
cmyk(0%, 71%, 55%, 73%)
Oklch
oklch(27.5% 0.076 10.0)

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

#8FA4BF

Azure · DarkGray · Cobalt Blue

HEX
#8FA4BF
RGB
rgb(143, 164, 191)
HSL
hsl(214, 27%, 65%)
HSB
hsb(214, 25%, 75%)
CMYK
cmyk(25%, 14%, 0%, 25%)
Oklch
oklch(71.2% 0.046 254.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F75D23
22BEF7

Analogous

F72253
F75D23
F7C522

Triadic

F75D23
22F75A
5A22F7

Split-Comp.

F75D23
22F7C5
2253F7

Tetradic

F75D23
53F722
22BEF7
C522F7

Contrast Matrix WCAG 2.1 Contrast

F75D23
BB2115
A6195F
45141F
8FA4BF
—
2.0
Fail
2.2
Fail
4.8
AA
1.3
Fail
2.0
Fail
—
1.1
Fail
2.4
Fail
2.5
Fail
2.2
Fail
1.1
Fail
—
2.1
Fail
2.8
Fail
4.8
AA
2.4
Fail
2.1
Fail
—
6.0
AA
1.3
Fail
2.5
Fail
2.8
Fail
6.0
AA
—
White BG
3.2AA Large
6.3AA
7.2AAA
15.3AAA
2.6Fail
Black BG
6.5AA
3.3AA Large
2.9Fail
1.4Fail
8.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B331
787718
69684E
302F1C
9898B8

Deuteranopia

BDC934
818D19
717C4A
33361C
9795B7

Tritanopia

EF3C3F
B31A1B
9F413E
431A1A
90B3B2

Achromatopsia

848484
4E4E4E
4B4B4B
242424
A1A1A1

Shades & Tints Shades & Tints

#F75D23

Dark
Light

#BB2115

Dark
Light

#A6195F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f75d23;
  --color-2: #bb2115;
  --color-3: #a6195f;
  --color-4: #45141f;
  --color-5: #8fa4bf;
}

SCSS

$color-1: #f75d23;
$color-2: #bb2115;
$color-3: #a6195f;
$color-4: #45141f;
$color-5: #8fa4bf;

TAILWIND

colors: {
  'brand-1': '#f75d23',
  'brand-2': '#bb2115',
  'brand-3': '#a6195f',
  'brand-4': '#45141f',
  'brand-5': '#8fa4bf',
}

RGB Array

[247, 93, 35], [187, 33, 21], [166, 25, 95], [69, 20, 31], [143, 164, 191]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #F75D23, #BB2115, #A6195F, #45141F, #8FA4BF 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: #f75d23; --color-2: #bb2115; --color-3: #a6195f; --color-4: #45141f; --color-5: #8fa4bf. 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 sunset-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