#8591A7 + #BFAEB4 + #DCBEBC + #EFDCCD + #F2E9DA · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#8591A7

Azure · LightSlateGray · Navy Blue

HEX

#8591A7

RGB

rgb(133, 145, 167)

HSL

hsl(219, 16%, 59%)

HSB

hsb(219, 20%, 65%)

CMYK

cmyk(20%, 13%, 0%, 35%)

Oklch

oklch(65.5% 0.036 262.6)

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

#BFAEB4

Rouge · Silver · Rose Pink

HEX

#BFAEB4

RGB

rgb(191, 174, 180)

HSL

hsl(339, 12%, 72%)

HSB

hsb(339, 9%, 75%)

CMYK

cmyk(0%, 9%, 6%, 25%)

Oklch

oklch(76.7% 0.021 354.2)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#DCBEBC

Peach Pink · Silver · Coral Red

HEX

#DCBEBC

RGB

rgb(220, 190, 188)

HSL

hsl(4, 31%, 80%)

HSB

hsb(4, 15%, 86%)

CMYK

cmyk(0%, 14%, 15%, 14%)

Oklch

oklch(82.7% 0.034 22.4)

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

#EFDCCD

Apricot · Bisque · Peach Orange

HEX

#EFDCCD

RGB

rgb(239, 220, 205)

HSL

hsl(26, 52%, 87%)

HSB

hsb(26, 14%, 94%)

CMYK

cmyk(0%, 8%, 14%, 6%)

Oklch

oklch(90.6% 0.029 60.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#F2E9DA

Goose Yellow · Beige · Peach Orange

HEX

#F2E9DA

RGB

rgb(242, 233, 218)

HSL

hsl(38, 48%, 90%)

HSB

hsb(38, 10%, 95%)

CMYK

cmyk(0%, 4%, 10%, 5%)

Oklch

oklch(93.7% 0.022 80.7)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8591A7

A79B86

Analogous

86A2A7

8591A7

8B86A7

Triadic

8591A7

A78691

91A786

Split-Comp.

8591A7

A78B86

A2A786

Tetradic

8591A7

A786A2

A79B86

86A78B

Contrast Matrix WCAG 2.1 Contrast

8591A7	BFAEB4	DCBEBC	EFDCCD	F2E9DA
—	1.5 Fail	1.8 Fail	2.4 Fail	2.6 Fail
1.5 Fail	—	1.2 Fail	1.6 Fail	1.8 Fail
1.8 Fail	1.2 Fail	—	1.3 Fail	1.4 Fail
2.4 Fail	1.6 Fail	1.3 Fail	—	1.1 Fail
2.6 Fail	1.8 Fail	1.4 Fail	1.1 Fail	—

White BG

3.2AA Large

2.1Fail

1.7Fail

1.3Fail

1.2Fail

Black BG

6.6AA

9.9AAA

12.1AAA

15.8AAA

17.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8A8AA2

B8B7B3

CFCFBC

E7E7D1

EEEEDE

Deuteranopia

8A89A0

B9BAB2

D1D3BD

E8E9D2

EFEFDF

Tritanopia

869D9D

BEB1B1

DBBDBD

EED3D4

F2E0E1

Achromatopsia

909090

B4B4B4

C7C7C7

E0E0E0

EAEAEA

Shades & Tints Shades & Tints

#8591A7

Dark

Light

#BFAEB4

Dark

Light

#DCBEBC

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8591a7;
  --color-2: #bfaeb4;
  --color-3: #dcbebc;
  --color-4: #efdccd;
  --color-5: #f2e9da;
}

SCSS

$color-1: #8591a7;
$color-2: #bfaeb4;
$color-3: #dcbebc;
$color-4: #efdccd;
$color-5: #f2e9da;

TAILWIND

colors: {
  'brand-1': '#8591a7',
  'brand-2': '#bfaeb4',
  'brand-3': '#dcbebc',
  'brand-4': '#efdccd',
  'brand-5': '#f2e9da',
}

RGB Array

[133, 145, 167], [191, 174, 180], [220, 190, 188], [239, 220, 205], [242, 233, 218]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #8591A7, #BFAEB4, #DCBEBC, #EFDCCD, #F2E9DA is ideal for: health products, baby brands, fresh-style blogs. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #8591a7; --color-2: #bfaeb4; --color-3: #dcbebc; --color-4: #efdccd; --color-5: #f2e9da. 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 tech, SaaS, healthcare, eco industries. 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