← Back to Editor

#FFF6A7 · #D36477 · #935387 · #3B3889 · #06000B

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

#FFF6A7

Fresh Green · Wheat · Lemon Cream

HEX
#FFF6A7
RGB
rgb(255, 246, 167)
HSL
hsl(54, 100%, 83%)
HSB
hsb(54, 35%, 100%)
CMYK
cmyk(0%, 4%, 35%, 0%)
Oklch
oklch(96.2% 0.099 102.5)

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

#D36477

Peach Pink · LightCoral · Coral Red

HEX
#D36477
RGB
rgb(211, 100, 119)
HSL
hsl(350, 56%, 61%)
HSB
hsb(350, 53%, 83%)
CMYK
cmyk(0%, 53%, 44%, 17%)
Oklch
oklch(64.2% 0.141 11.2)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#935387

Rose Purple · Gray · Violet

HEX
#935387
RGB
rgb(147, 83, 135)
HSL
hsl(311, 28%, 45%)
HSB
hsb(311, 44%, 58%)
CMYK
cmyk(0%, 44%, 8%, 42%)
Oklch
oklch(53.5% 0.110 334.3)

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

#3B3889

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX
#3B3889
RGB
rgb(59, 56, 137)
HSL
hsl(242, 42%, 38%)
HSB
hsb(242, 59%, 54%)
CMYK
cmyk(57%, 59%, 0%, 46%)
Oklch
oklch(39.2% 0.131 280.1)

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

#06000B

Royal Purple · Black · Dark Purple

HEX
#06000B
RGB
rgb(6, 0, 11)
HSL
hsl(273, 100%, 2%)
HSB
hsb(273, 100%, 4%)
CMYK
cmyk(45%, 100%, 0%, 96%)
Oklch
oklch(9.2% 0.046 314.0)

Traditional「Royal Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFF6A7
A8B1FF

Analogous

FFCBA8
FFF6A7
DCFFA8

Triadic

FFF6A7
A8FFF6
F6A8FF

Split-Comp.

FFF6A7
A8DCFF
CBA8FF

Tetradic

FFF6A7
A8FFCB
A8B1FF
FFA8DC

Contrast Matrix WCAG 2.1 Contrast

FFF6A7
D36477
935387
3B3889
06000B
—
3.2
AA Large
5.0
AA
9.0
AAA
18.8
AAA
3.2
AA Large
—
1.5
Fail
2.8
Fail
5.8
AA
5.0
AA
1.5
Fail
—
1.8
Fail
3.8
AA Large
9.0
AAA
2.8
Fail
1.8
Fail
—
2.1
Fail
18.8
AAA
5.8
AA
3.8
AA Large
2.1
Fail
—
White BG
1.1Fail
3.6AA Large
5.5AA
9.9AAA
20.7AAA
Black BG
19.0AAA
5.9AA
3.8AA Large
2.1Fail
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FBFBBA
A3A272
77777A
3A3A75
030308

Deuteranopia

FCFCBF
A9B271
7B8077
3A3A71
040408

Tritanopia

FFC9CD
CD6F6E
90706E
3B6663
060606

Achromatopsia

F0F0F0
878787
6C6C6C
424242
030303

Shades & Tints Shades & Tints

#FFF6A7

Dark
Light

#D36477

Dark
Light

#935387

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fff6a7;
  --color-2: #d36477;
  --color-3: #935387;
  --color-4: #3b3889;
  --color-5: #06000b;
}

SCSS

$color-1: #fff6a7;
$color-2: #d36477;
$color-3: #935387;
$color-4: #3b3889;
$color-5: #06000b;

TAILWIND

colors: {
  'brand-1': '#fff6a7',
  'brand-2': '#d36477',
  'brand-3': '#935387',
  'brand-4': '#3b3889',
  'brand-5': '#06000b',
}

RGB Array

[255, 246, 167], [211, 100, 119], [147, 83, 135], [59, 56, 137], [6, 0, 11]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #FFF6A7, #D36477, #935387, #3B3889, #06000B 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: #fff6a7; --color-2: #d36477; --color-3: #935387; --color-4: #3b3889; --color-5: #06000b. 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