← Back to Editor

#939089 · #C7AEA2 · #F8CBB9 · #F0EEDB · #D2E6D9

sunset

A 5-color sunset palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#939089

Ash · Gray · Silver Sand

HEX
#939089
RGB
rgb(147, 144, 137)
HSL
hsl(42, 4%, 56%)
HSB
hsb(42, 7%, 58%)
CMYK
cmyk(0%, 2%, 7%, 42%)
Oklch
oklch(65.4% 0.011 87.5)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#C7AEA2

Apricot · Tan · Warm Sun

HEX
#C7AEA2
RGB
rgb(199, 174, 162)
HSL
hsl(19, 25%, 71%)
HSB
hsb(19, 19%, 78%)
CMYK
cmyk(0%, 13%, 19%, 22%)
Oklch
oklch(76.9% 0.034 47.3)

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

#F8CBB9

Apricot · Wheat · Peach Orange

HEX
#F8CBB9
RGB
rgb(248, 203, 185)
HSL
hsl(17, 82%, 85%)
HSB
hsb(17, 25%, 97%)
CMYK
cmyk(0%, 18%, 25%, 3%)
Oklch
oklch(87.6% 0.057 42.9)

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

#F0EEDB

Fresh Green · Beige · Lemon Cream

HEX
#F0EEDB
RGB
rgb(240, 238, 219)
HSL
hsl(54, 41%, 90%)
HSB
hsb(54, 9%, 94%)
CMYK
cmyk(0%, 1%, 9%, 6%)
Oklch
oklch(94.6% 0.025 102.0)

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

#D2E6D9

Celadon · LightGray · Mint Green

HEX
#D2E6D9
RGB
rgb(210, 230, 217)
HSL
hsl(141, 29%, 86%)
HSB
hsb(141, 9%, 90%)
CMYK
cmyk(9%, 0%, 6%, 10%)
Oklch
oklch(90.6% 0.028 157.3)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

939089
8A8D93

Analogous

938C8A
939089
91938A

Triadic

939089
8A9391
918A93

Split-Comp.

939089
8A9193
8C8A93

Tetradic

939089
8A938C
8A8D93
938A91

Contrast Matrix WCAG 2.1 Contrast

939089
C7AEA2
F8CBB9
F0EEDB
D2E6D9
—
1.5
Fail
2.2
Fail
2.7
Fail
2.4
Fail
1.5
Fail
—
1.4
Fail
1.8
Fail
1.6
Fail
2.2
Fail
1.4
Fail
—
1.3
Fail
1.1
Fail
2.7
Fail
1.8
Fail
1.3
Fail
—
1.1
Fail
2.4
Fail
1.6
Fail
1.1
Fail
1.1
Fail
—
White BG
3.2AA Large
2.1Fail
1.5Fail
1.2Fail
1.3Fail
Black BG
6.6AA
10.0AAA
14.2AAA
18.0AAA
16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

92928B
BCBCA5
E5E4BD
EFEFE0
DBDBDC

Deuteranopia

92928B
BEBFA6
E7EBBE
EFEFE1
DAD8DD

Tritanopia

938C8C
C6A7A8
F6C1C2
F0E3E4
D3DFDF

Achromatopsia

909090
B4B4B4
D6D6D6
ECECEC
DFDFDF

Shades & Tints Shades & Tints

#939089

Dark
Light

#C7AEA2

Dark
Light

#F8CBB9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #939089;
  --color-2: #c7aea2;
  --color-3: #f8cbb9;
  --color-4: #f0eedb;
  --color-5: #d2e6d9;
}

SCSS

$color-1: #939089;
$color-2: #c7aea2;
$color-3: #f8cbb9;
$color-4: #f0eedb;
$color-5: #d2e6d9;

TAILWIND

colors: {
  'brand-1': '#939089',
  'brand-2': '#c7aea2',
  'brand-3': '#f8cbb9',
  'brand-4': '#f0eedb',
  'brand-5': '#d2e6d9',
}

RGB Array

[147, 144, 137], [199, 174, 162], [248, 203, 185], [240, 238, 219], [210, 230, 217]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #939089, #C7AEA2, #F8CBB9, #F0EEDB, #D2E6D9 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: #939089; --color-2: #c7aea2; --color-3: #f8cbb9; --color-4: #f0eedb; --color-5: #d2e6d9. 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