← Back to Editor

#270F08 · #741033 · #B83F0A · #FD7F62 · #FDEF62

sunset

A 5-color sunset palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#270F08

Vermilion · Black · Deep Berry

HEX
#270F08
RGB
rgb(39, 15, 8)
HSL
hsl(14, 66%, 9%)
HSB
hsb(14, 79%, 15%)
CMYK
cmyk(0%, 62%, 79%, 85%)
Oklch
oklch(20.4% 0.043 37.3)

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

#741033

Dark Violet · Maroon · Camellia

HEX
#741033
RGB
rgb(116, 16, 51)
HSL
hsl(339, 76%, 26%)
HSB
hsb(339, 86%, 45%)
CMYK
cmyk(0%, 86%, 56%, 55%)
Oklch
oklch(36.8% 0.134 7.0)

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

#B83F0A

Tangerine · FireBrick · Amber Brown

HEX
#B83F0A
RGB
rgb(184, 63, 10)
HSL
hsl(18, 90%, 38%)
HSB
hsb(18, 95%, 72%)
CMYK
cmyk(0%, 66%, 95%, 28%)
Oklch
oklch(53.4% 0.166 39.1)

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

#FD7F62

Peach Pink · Salmon · Coral Red

HEX
#FD7F62
RGB
rgb(253, 127, 98)
HSL
hsl(11, 97%, 69%)
HSB
hsb(11, 61%, 99%)
CMYK
cmyk(0%, 50%, 61%, 1%)
Oklch
oklch(73.5% 0.160 34.2)

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

#FDEF62

Fresh Green · Khaki · Sunflower

HEX
#FDEF62
RGB
rgb(253, 239, 98)
HSL
hsl(55, 97%, 69%)
HSB
hsb(55, 61%, 99%)
CMYK
cmyk(0%, 6%, 61%, 1%)
Oklch
oklch(93.8% 0.159 103.6)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

270F08
081F26

Analogous

260810
270F08
261E08

Triadic

270F08
08260F
0F0826

Split-Comp.

270F08
08261E
081026

Tetradic

270F08
102608
081F26
1E0826

Contrast Matrix WCAG 2.1 Contrast

270F08
741033
B83F0A
FD7F62
FDEF62
—
1.6
Fail
3.2
AA Large
7.2
AAA
15.3
AAA
1.6
Fail
—
2.0
Fail
4.5
AA Large
9.5
AAA
3.2
AA Large
2.0
Fail
—
2.2
Fail
4.7
AA
7.2
AAA
4.5
AA Large
2.2
Fail
—
2.1
Fail
15.3
AAA
9.5
AAA
4.7
AA
2.1
Fail
—
White BG
18.1AAA
11.3AAA
5.6AA
2.5Fail
1.2Fail
Black BG
1.2Fail
1.9Fail
3.8AA Large
8.4AAA
17.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

1D1C0A
49482B
848317
C6C569
F7F784

Deuteranopia

1E200A
4F5628
8B941A
CED76B
F8F98C

Tritanopia

260B0B
6F2422
B22123
F76F70
FC9FA5

Achromatopsia

151515
323232
5D5D5D
A1A1A1
E3E3E3

Shades & Tints Shades & Tints

#270F08

Dark
Light

#741033

Dark
Light

#B83F0A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #270f08;
  --color-2: #741033;
  --color-3: #b83f0a;
  --color-4: #fd7f62;
  --color-5: #fdef62;
}

SCSS

$color-1: #270f08;
$color-2: #741033;
$color-3: #b83f0a;
$color-4: #fd7f62;
$color-5: #fdef62;

TAILWIND

colors: {
  'brand-1': '#270f08',
  'brand-2': '#741033',
  'brand-3': '#b83f0a',
  'brand-4': '#fd7f62',
  'brand-5': '#fdef62',
}

RGB Array

[39, 15, 8], [116, 16, 51], [184, 63, 10], [253, 127, 98], [253, 239, 98]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #270F08, #741033, #B83F0A, #FD7F62, #FDEF62 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: #270f08; --color-2: #741033; --color-3: #b83f0a; --color-4: #fd7f62; --color-5: #fdef62. 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