#9F8287 + #BA958C + #DAA092 + #F3B397 + #F0C09C · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#9F8287

Crimson · Gray · Passion Red

HEX

#9F8287

RGB

rgb(159, 130, 135)

HSL

hsl(350, 13%, 57%)

HSB

hsb(350, 18%, 62%)

CMYK

cmyk(0%, 18%, 15%, 38%)

Oklch

oklch(63.5% 0.036 6.5)

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

#BA958C

Peach Pink · DarkGray · Coral Red

HEX

#BA958C

RGB

rgb(186, 149, 140)

HSL

hsl(12, 25%, 64%)

HSB

hsb(12, 25%, 73%)

CMYK

cmyk(0%, 20%, 25%, 27%)

Oklch

oklch(70.2% 0.047 34.0)

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

#DAA092

Peach Pink · Tan · Coral Red

HEX

#DAA092

RGB

rgb(218, 160, 146)

HSL

hsl(12, 49%, 71%)

HSB

hsb(12, 33%, 85%)

CMYK

cmyk(0%, 27%, 33%, 15%)

Oklch

oklch(75.7% 0.072 34.0)

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

#F3B397

Apricot · BurlyWood · Peach Orange

HEX

#F3B397

RGB

rgb(243, 179, 151)

HSL

hsl(18, 79%, 77%)

HSB

hsb(18, 38%, 95%)

CMYK

cmyk(0%, 26%, 38%, 5%)

Oklch

oklch(81.9% 0.084 44.6)

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

#F0C09C

Apricot · BurlyWood · Peach Orange

HEX

#F0C09C

RGB

rgb(240, 192, 156)

HSL

hsl(26, 74%, 78%)

HSB

hsb(26, 35%, 94%)

CMYK

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

Oklch

oklch(84.2% 0.073 58.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9F8287

83A09B

Analogous

A08396

9F8287

A08D83

Triadic

9F8287

88A083

8388A0

Split-Comp.

9F8287

83A08D

8396A0

Tetradic

9F8287

96A083

83A09B

8D83A0

Contrast Matrix WCAG 2.1 Contrast

9F8287	BA958C	DAA092	F3B397	F0C09C
—	1.3 Fail	1.6 Fail	1.9 Fail	2.1 Fail
1.3 Fail	—	1.2 Fail	1.5 Fail	1.6 Fail
1.6 Fail	1.2 Fail	—	1.2 Fail	1.4 Fail
1.9 Fail	1.5 Fail	1.2 Fail	—	1.1 Fail
2.1 Fail	1.6 Fail	1.4 Fail	1.1 Fail	—

White BG

3.5AA Large

2.7Fail

2.2Fail

1.8Fail

1.7Fail

Black BG

6.0AA

7.8AAA

9.4AAA

11.7AAA

12.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

929286

AAAA8E

C1C095

D7D79E

DBDBA5

Deuteranopia

949686

ACAF8F

C4C996

DBE09F

DEE2A7

Tritanopia

9E8585

B89090

D79899

F0A3A4

EEACAD

Achromatopsia

8B8B8B

9F9F9F

B0B0B0

C3C3C3

CACACA

Shades & Tints Shades & Tints

#9F8287

Dark

Light

#BA958C

Dark

Light

#DAA092

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9f8287;
  --color-2: #ba958c;
  --color-3: #daa092;
  --color-4: #f3b397;
  --color-5: #f0c09c;
}

SCSS

$color-1: #9f8287;
$color-2: #ba958c;
$color-3: #daa092;
$color-4: #f3b397;
$color-5: #f0c09c;

TAILWIND

colors: {
  'brand-1': '#9f8287',
  'brand-2': '#ba958c',
  'brand-3': '#daa092',
  'brand-4': '#f3b397',
  'brand-5': '#f0c09c',
}

RGB Array

[159, 130, 135], [186, 149, 140], [218, 160, 146], [243, 179, 151], [240, 192, 156]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #9F8287, #BA958C, #DAA092, #F3B397, #F0C09C 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: #9f8287; --color-2: #ba958c; --color-3: #daa092; --color-4: #f3b397; --color-5: #f0c09c. 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