#FFFFAC + #FFDB9F + #E4B49D + #B49FA2 + #8C9AB1 · sunset - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFFFAC

Fresh Green · Wheat · Lemon Cream

HEX

#FFFFAC

RGB

rgb(255, 255, 172)

HSL

hsl(60, 100%, 84%)

HSB

hsb(60, 33%, 100%)

CMYK

cmyk(0%, 0%, 33%, 0%)

Oklch

oklch(98.1% 0.104 108.2)

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

#FFDB9F

Goose Yellow · Wheat · Peach Orange

HEX

#FFDB9F

RGB

rgb(255, 219, 159)

HSL

hsl(37, 100%, 81%)

HSB

hsb(37, 38%, 100%)

CMYK

cmyk(0%, 14%, 38%, 0%)

Oklch

oklch(90.8% 0.086 80.1)

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

#E4B49D

Apricot · BurlyWood · Warm Sun

HEX

#E4B49D

RGB

rgb(228, 180, 157)

HSL

hsl(19, 57%, 75%)

HSB

hsb(19, 31%, 89%)

CMYK

cmyk(0%, 21%, 31%, 11%)

Oklch

oklch(80.7% 0.064 46.9)

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

#B49FA2

Peach Pink · DarkGray · Coral Red

HEX

#B49FA2

RGB

rgb(180, 159, 162)

HSL

hsl(351, 12%, 66%)

HSB

hsb(351, 12%, 71%)

CMYK

cmyk(0%, 12%, 10%, 29%)

Oklch

oklch(72.2% 0.025 7.9)

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

#8C9AB1

Azure · DarkGray · Cobalt Blue

HEX

#8C9AB1

RGB

rgb(140, 154, 177)

HSL

hsl(217, 19%, 62%)

HSB

hsb(217, 21%, 69%)

CMYK

cmyk(21%, 13%, 0%, 31%)

Oklch

oklch(68.3% 0.038 260.4)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFFAC

ADADFF

Analogous

FFD6AD

FFFFAC

D6FFAD

Triadic

FFFFAC

ADFFFF

FFADFF

Split-Comp.

FFFFAC

ADD6FF

D6ADFF

Tetradic

FFFFAC

ADFFD6

ADADFF

FFADD6

Contrast Matrix WCAG 2.1 Contrast

FFFFAC	FFDB9F	E4B49D	B49FA2	8C9AB1
—	1.3 Fail	1.8 Fail	2.4 Fail	2.7 Fail
1.3 Fail	—	1.4 Fail	1.9 Fail	2.2 Fail
1.8 Fail	1.4 Fail	—	1.3 Fail	1.5 Fail
2.4 Fail	1.9 Fail	1.3 Fail	—	1.1 Fail
2.7 Fail	2.2 Fail	1.5 Fail	1.1 Fail	—

White BG

1.0Fail

1.3Fail

1.9Fail

2.5Fail

2.8Fail

Black BG

20.2AAA

15.9AAA

11.3AAA

8.4AAA

7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FFFFC0

EFEFAE

CFCFA3

ABABA1

9292AB

Deuteranopia

FFFFC5

F2F4B1

D2D6A4

ACAEA1

9190AA

Tritanopia

FFD0D3

FDB9BC

E2A7A8

B3A1A1

8DA7A6

Achromatopsia

F6F6F6

DFDFDF

C0C0C0

A6A6A6

989898

Shades & Tints Shades & Tints

#FFFFAC

Dark

Light

#FFDB9F

Dark

Light

#E4B49D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffffac;
  --color-2: #ffdb9f;
  --color-3: #e4b49d;
  --color-4: #b49fa2;
  --color-5: #8c9ab1;
}

SCSS

$color-1: #ffffac;
$color-2: #ffdb9f;
$color-3: #e4b49d;
$color-4: #b49fa2;
$color-5: #8c9ab1;

TAILWIND

colors: {
  'brand-1': '#ffffac',
  'brand-2': '#ffdb9f',
  'brand-3': '#e4b49d',
  'brand-4': '#b49fa2',
  'brand-5': '#8c9ab1',
}

RGB Array

[255, 255, 172], [255, 219, 159], [228, 180, 157], [180, 159, 162], [140, 154, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #FFFFAC, #FFDB9F, #E4B49D, #B49FA2, #8C9AB1 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: #ffffac; --color-2: #ffdb9f; --color-3: #e4b49d; --color-4: #b49fa2; --color-5: #8c9ab1. 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