← Back to Editor

#BC697D · #E7816B · #FE9566 · #FFAF66 · #FEE27F

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 App

Color Details Color Details

#BC697D

Crimson · LightCoral · Passion Red

HEX
#BC697D
RGB
rgb(188, 105, 125)
HSL
hsl(346, 38%, 57%)
HSB
hsb(346, 44%, 74%)
CMYK
cmyk(0%, 44%, 34%, 26%)
Oklch
oklch(62.0% 0.108 5.3)

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

#E7816B

Peach Pink · Salmon · Coral Red

HEX
#E7816B
RGB
rgb(231, 129, 107)
HSL
hsl(11, 72%, 66%)
HSB
hsb(11, 54%, 91%)
CMYK
cmyk(0%, 44%, 54%, 9%)
Oklch
oklch(71.0% 0.130 33.2)

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

#FE9566

Apricot · SandyBrown · Warm Sun

HEX
#FE9566
RGB
rgb(254, 149, 102)
HSL
hsl(19, 99%, 70%)
HSB
hsb(19, 60%, 100%)
CMYK
cmyk(0%, 41%, 60%, 0%)
Oklch
oklch(77.1% 0.141 44.3)

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

#FFAF66

Apricot · SandyBrown · Warm Sun

HEX
#FFAF66
RGB
rgb(255, 175, 102)
HSL
hsl(29, 100%, 70%)
HSB
hsb(29, 60%, 100%)
CMYK
cmyk(0%, 31%, 60%, 0%)
Oklch
oklch(81.7% 0.130 61.7)

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

#FEE27F

Goose Yellow · Khaki · Sunflower

HEX
#FEE27F
RGB
rgb(254, 226, 127)
HSL
hsl(47, 98%, 75%)
HSB
hsb(47, 50%, 100%)
CMYK
cmyk(0%, 11%, 50%, 0%)
Oklch
oklch(91.6% 0.123 94.0)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BC697D
68BBA8

Analogous

BB68A5
BC697D
BB7E68

Triadic

BC697D
7BBB68
687BBB

Split-Comp.

BC697D
68BB7E
68A5BB

Tetradic

BC697D
A5BB68
68BBA8
7E68BB

Contrast Matrix WCAG 2.1 Contrast

BC697D
E7816B
FE9566
FFAF66
FEE27F
—
1.4
Fail
1.8
Fail
2.1
Fail
3.0
AA Large
1.4
Fail
—
1.3
Fail
1.5
Fail
2.1
Fail
1.8
Fail
1.3
Fail
—
1.2
Fail
1.7
Fail
2.1
Fail
1.5
Fail
1.2
Fail
—
1.4
Fail
3.0
AA Large
2.1
Fail
1.7
Fail
1.4
Fail
—
White BG
3.8AA Large
2.7Fail
2.2Fail
1.8Fail
1.3Fail
Black BG
5.5AA
7.8AAA
9.7AAA
11.6AAA
16.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

989778
BBBA70
D1D071
DCDC78
F2F297

Deuteranopia

9DA377
C1C872
D7DE74
E1E77C
F4F69D

Tritanopia

B87474
E27575
F97A7C
FB8689
FDAAAE

Achromatopsia

848484
9D9D9D
AFAFAF
BFBFBF
DFDFDF

Shades & Tints Shades & Tints

#BC697D

Dark
Light

#E7816B

Dark
Light

#FE9566

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bc697d;
  --color-2: #e7816b;
  --color-3: #fe9566;
  --color-4: #ffaf66;
  --color-5: #fee27f;
}

SCSS

$color-1: #bc697d;
$color-2: #e7816b;
$color-3: #fe9566;
$color-4: #ffaf66;
$color-5: #fee27f;

TAILWIND

colors: {
  'brand-1': '#bc697d',
  'brand-2': '#e7816b',
  'brand-3': '#fe9566',
  'brand-4': '#ffaf66',
  'brand-5': '#fee27f',
}

RGB Array

[188, 105, 125], [231, 129, 107], [254, 149, 102], [255, 175, 102], [254, 226, 127]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #BC697D, #E7816B, #FE9566, #FFAF66, #FEE27F is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. 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: #bc697d; --color-2: #e7816b; --color-3: #fe9566; --color-4: #ffaf66; --color-5: #fee27f. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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