#FF5157 + #E79072 + #D0C291 + #ACD3C0 + #5BC6CC · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FF5157

Peach Pink · Tomato · Coral Red

HEX

#FF5157

RGB

rgb(255, 81, 87)

HSL

hsl(358, 100%, 66%)

HSB

hsb(358, 68%, 100%)

CMYK

cmyk(0%, 68%, 66%, 0%)

Oklch

oklch(67.8% 0.210 22.9)

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

#E79072

Apricot · DarkSalmon · Warm Sun

HEX

#E79072

RGB

rgb(231, 144, 114)

HSL

hsl(15, 71%, 68%)

HSB

hsb(15, 51%, 91%)

CMYK

cmyk(0%, 38%, 51%, 9%)

Oklch

oklch(73.7% 0.114 39.8)

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

#D0C291

Ginger · Tan · Sunflower

HEX

#D0C291

RGB

rgb(208, 194, 145)

HSL

hsl(47, 40%, 69%)

HSB

hsb(47, 30%, 82%)

CMYK

cmyk(0%, 7%, 30%, 18%)

Oklch

oklch(81.4% 0.067 94.0)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#ACD3C0

Jade · Silver · Apple Green

HEX

#ACD3C0

RGB

rgb(172, 211, 192)

HSL

hsl(151, 31%, 75%)

HSB

hsb(151, 18%, 83%)

CMYK

cmyk(18%, 0%, 9%, 17%)

Oklch

oklch(83.3% 0.049 164.1)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#5BC6CC

Lake Blue · MediumTurquoise · Lake Green

HEX

#5BC6CC

RGB

rgb(91, 198, 204)

HSL

hsl(183, 53%, 58%)

HSB

hsb(183, 55%, 80%)

CMYK

cmyk(55%, 3%, 0%, 20%)

Oklch

oklch(76.6% 0.098 200.3)

Traditional「Lake Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF5157

52FFF9

Analogous

FF52AE

FF5157

FFA352

Triadic

FF5157

57FF52

5257FF

Split-Comp.

FF5157

52FFA3

52AEFF

Tetradic

FF5157

AEFF52

52FFF9

A352FF

Contrast Matrix WCAG 2.1 Contrast

FF5157	E79072	D0C291	ACD3C0	5BC6CC
—	1.3 Fail	1.8 Fail	2.0 Fail	1.6 Fail
1.3 Fail	—	1.4 Fail	1.5 Fail	1.2 Fail
1.8 Fail	1.4 Fail	—	1.1 Fail	1.1 Fail
2.0 Fail	1.5 Fail	1.1 Fail	—	1.2 Fail
1.6 Fail	1.2 Fail	1.1 Fail	1.2 Fail	—

White BG

3.2AA Large

2.4Fail

1.8Fail

1.6Fail

2.0Fail

Black BG

6.6AA

8.6AAA

11.8AAA

12.8AAA

10.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B256

C1C179

CACA9D

BDBDC5

898ACB

Deuteranopia

BECB55

C6CD7B

CBCCA0

BBB8C6

837BCA

Tritanopia

F65454

E37F80

CFA6A8

AEC8C9

60C9C9

Achromatopsia

868686

A7A7A7

C1C1C1

C5C5C5

A7A7A7

Shades & Tints Shades & Tints

#FF5157

Dark

Light

#E79072

Dark

Light

#D0C291

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff5157;
  --color-2: #e79072;
  --color-3: #d0c291;
  --color-4: #acd3c0;
  --color-5: #5bc6cc;
}

SCSS

$color-1: #ff5157;
$color-2: #e79072;
$color-3: #d0c291;
$color-4: #acd3c0;
$color-5: #5bc6cc;

TAILWIND

colors: {
  'brand-1': '#ff5157',
  'brand-2': '#e79072',
  'brand-3': '#d0c291',
  'brand-4': '#acd3c0',
  'brand-5': '#5bc6cc',
}

RGB Array

[255, 81, 87], [231, 144, 114], [208, 194, 145], [172, 211, 192], [91, 198, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #FF5157, #E79072, #D0C291, #ACD3C0, #5BC6CC 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: #ff5157; --color-2: #e79072; --color-3: #d0c291; --color-4: #acd3c0; --color-5: #5bc6cc. 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