← Back to Editor

#A1BBD1 · #8EA5FD · #747FBC · #E95DD0 · #FB7F9F

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 App

Color Details Color Details

#A1BBD1

Sky Blue · LightSteelBlue · Cobalt Blue

HEX
#A1BBD1
RGB
rgb(161, 187, 209)
HSL
hsl(208, 34%, 73%)
HSB
hsb(208, 23%, 82%)
CMYK
cmyk(23%, 11%, 0%, 18%)
Oklch
oklch(78.0% 0.042 243.9)

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

#8EA5FD

Azure · LightSkyBlue · Cobalt Blue

HEX
#8EA5FD
RGB
rgb(142, 165, 253)
HSL
hsl(228, 97%, 77%)
HSB
hsb(228, 44%, 99%)
CMYK
cmyk(44%, 35%, 0%, 1%)
Oklch
oklch(74.0% 0.130 271.8)

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

#747FBC

Azure · LightSlateGray · Navy Blue

HEX
#747FBC
RGB
rgb(116, 127, 188)
HSL
hsl(231, 35%, 60%)
HSB
hsb(231, 38%, 74%)
CMYK
cmyk(38%, 32%, 0%, 26%)
Oklch
oklch(61.3% 0.093 275.5)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#E95DD0

Mauve · Orchid · Lilac Purple

HEX
#E95DD0
RGB
rgb(233, 93, 208)
HSL
hsl(311, 76%, 64%)
HSB
hsb(311, 60%, 91%)
CMYK
cmyk(0%, 60%, 11%, 9%)
Oklch
oklch(69.5% 0.215 335.3)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#FB7F9F

Peach Pink · LightCoral · Coral Red

HEX
#FB7F9F
RGB
rgb(251, 127, 159)
HSL
hsl(345, 94%, 74%)
HSB
hsb(345, 49%, 98%)
CMYK
cmyk(0%, 49%, 37%, 2%)
Oklch
oklch(74.5% 0.154 5.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A1BBD1
D2B9A3

Analogous

A3D2D0
A1BBD1
A3A4D2

Triadic

A1BBD1
D2A3BC
BCD2A3

Split-Comp.

A1BBD1
D2A3A4
D2D0A3

Tetradic

A1BBD1
D0A3D2
D2B9A3
A4D2A3

Contrast Matrix WCAG 2.1 Contrast

A1BBD1
8EA5FD
747FBC
E95DD0
FB7F9F
—
1.2
Fail
1.9
Fail
1.5
Fail
1.2
Fail
1.2
Fail
—
1.6
Fail
1.3
Fail
1.0
Fail
1.9
Fail
1.6
Fail
—
1.3
Fail
1.6
Fail
1.5
Fail
1.3
Fail
1.3
Fail
—
1.2
Fail
1.2
Fail
1.0
Fail
1.6
Fail
1.2
Fail
—
White BG
2.0Fail
2.3Fail
3.8AA Large
3.0AA Large
2.4Fail
Black BG
10.5AAA
9.0AAA
5.5AA
6.9AA
8.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ACACCC
9898E8
7979AD
ACABB4
C5C497

Deuteranopia

ABA9CA
9795E3
7877AA
B5BFAE
CDD695

Tritanopia

A2C7C7
8FD7D3
75A29F
E29E99
F59190

Achromatopsia

B6B6B6
A8A8A8
838383
949494
A8A8A8

Shades & Tints Shades & Tints

#A1BBD1

Dark
Light

#8EA5FD

Dark
Light

#747FBC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a1bbd1;
  --color-2: #8ea5fd;
  --color-3: #747fbc;
  --color-4: #e95dd0;
  --color-5: #fb7f9f;
}

SCSS

$color-1: #a1bbd1;
$color-2: #8ea5fd;
$color-3: #747fbc;
$color-4: #e95dd0;
$color-5: #fb7f9f;

TAILWIND

colors: {
  'brand-1': '#a1bbd1',
  'brand-2': '#8ea5fd',
  'brand-3': '#747fbc',
  'brand-4': '#e95dd0',
  'brand-5': '#fb7f9f',
}

RGB Array

[161, 187, 209], [142, 165, 253], [116, 127, 188], [233, 93, 208], [251, 127, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #A1BBD1, #8EA5FD, #747FBC, #E95DD0, #FB7F9F 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: #a1bbd1; --color-2: #8ea5fd; --color-3: #747fbc; --color-4: #e95dd0; --color-5: #fb7f9f. 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