#73819F + #F7E397 + #F8D089 + #DDAA84 + #A3879A · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#73819F

Azure · LightSlateGray · Navy Blue

HEX

#73819F

RGB

rgb(115, 129, 159)

HSL

hsl(221, 19%, 54%)

HSB

hsb(221, 28%, 62%)

CMYK

cmyk(28%, 19%, 0%, 38%)

Oklch

oklch(60.3% 0.049 265.3)

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

#F7E397

Goose Yellow · Khaki · Lemon Cream

HEX

#F7E397

RGB

rgb(247, 227, 151)

HSL

hsl(47, 86%, 78%)

HSB

hsb(47, 39%, 97%)

CMYK

cmyk(0%, 8%, 39%, 3%)

Oklch

oklch(91.5% 0.098 95.1)

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

#F8D089

Goose Yellow · Khaki · Warm Sun

HEX

#F8D089

RGB

rgb(248, 208, 137)

HSL

hsl(38, 89%, 75%)

HSB

hsb(38, 45%, 97%)

CMYK

cmyk(0%, 16%, 45%, 3%)

Oklch

oklch(87.6% 0.100 81.2)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#DDAA84

Apricot · BurlyWood · Warm Sun

HEX

#DDAA84

RGB

rgb(221, 170, 132)

HSL

hsl(26, 57%, 69%)

HSB

hsb(26, 40%, 87%)

CMYK

cmyk(0%, 23%, 40%, 13%)

Oklch

oklch(77.6% 0.079 57.9)

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

#A3879A

Rose Purple · DarkGray · Violet

HEX

#A3879A

RGB

rgb(163, 135, 154)

HSL

hsl(319, 13%, 58%)

HSB

hsb(319, 17%, 64%)

CMYK

cmyk(0%, 17%, 6%, 36%)

Oklch

oklch(65.5% 0.043 338.0)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

73819F

A09273

Analogous

7398A0

73819F

7C73A0

Triadic

73819F

A07382

82A073

Split-Comp.

73819F

A07C73

98A073

Tetradic

73819F

A07398

A09273

73A07C

Contrast Matrix WCAG 2.1 Contrast

73819F	F7E397	F8D089	DDAA84	A3879A
—	3.1 AA Large	2.7 Fail	1.9 Fail	1.2 Fail
3.1 AA Large	—	1.1 Fail	1.6 Fail	2.5 Fail
2.7 Fail	1.1 Fail	—	1.4 Fail	2.2 Fail
1.9 Fail	1.6 Fail	1.4 Fail	—	1.6 Fail
1.2 Fail	2.5 Fail	2.2 Fail	1.6 Fail	—

White BG

3.9AA Large

1.3Fail

1.5Fail

2.1Fail

3.2AA Large

Black BG

5.4AA

16.4AAA

14.4AAA

10.2AAA

6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

797998

EEEEA9

E7E69A

C7C68D

979795

Deuteranopia

787796

F0F1AE

E9EC9E

CACE8F

999B94

Tritanopia

749291

F6B8BB

F6A8AB

DA9496

A29291

Achromatopsia

808080

E0E0E0

D4D4D4

B5B5B5

929292

Shades & Tints Shades & Tints

#73819F

Dark

Light

#F7E397

Dark

Light

#F8D089

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #73819f;
  --color-2: #f7e397;
  --color-3: #f8d089;
  --color-4: #ddaa84;
  --color-5: #a3879a;
}

SCSS

$color-1: #73819f;
$color-2: #f7e397;
$color-3: #f8d089;
$color-4: #ddaa84;
$color-5: #a3879a;

TAILWIND

colors: {
  'brand-1': '#73819f',
  'brand-2': '#f7e397',
  'brand-3': '#f8d089',
  'brand-4': '#ddaa84',
  'brand-5': '#a3879a',
}

RGB Array

[115, 129, 159], [247, 227, 151], [248, 208, 137], [221, 170, 132], [163, 135, 154]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #73819F, #F7E397, #F8D089, #DDAA84, #A3879A 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: #73819f; --color-2: #f7e397; --color-3: #f8d089; --color-4: #ddaa84; --color-5: #a3879a. 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