← Back to Editor

#FFF5D0 · #E7DE93 · #A680A0 · #7D5477 · #5D2448

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#FFF5D0

Goose Yellow · Beige · Lemon Cream

HEX
#FFF5D0
RGB
rgb(255, 245, 208)
HSL
hsl(47, 100%, 91%)
HSB
hsb(47, 18%, 100%)
CMYK
cmyk(0%, 4%, 18%, 0%)
Oklch
oklch(96.9% 0.049 94.6)

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

#E7DE93

Fresh Green · Khaki · Sunflower

HEX
#E7DE93
RGB
rgb(231, 222, 147)
HSL
hsl(54, 64%, 74%)
HSB
hsb(54, 36%, 91%)
CMYK
cmyk(0%, 4%, 36%, 9%)
Oklch
oklch(89.1% 0.096 102.3)

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

#A680A0

Rose Purple · DarkGray · Violet

HEX
#A680A0
RGB
rgb(166, 128, 160)
HSL
hsl(309, 18%, 58%)
HSB
hsb(309, 23%, 65%)
CMYK
cmyk(0%, 23%, 4%, 35%)
Oklch
oklch(64.7% 0.065 331.8)

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

#7D5477

Rose Purple · DimGray · Violet

HEX
#7D5477
RGB
rgb(125, 84, 119)
HSL
hsl(309, 20%, 41%)
HSB
hsb(309, 33%, 49%)
CMYK
cmyk(0%, 33%, 5%, 51%)
Oklch
oklch(50.3% 0.074 331.9)

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

#5D2448

Rose Purple · DarkSlateGray · Raspberry

HEX
#5D2448
RGB
rgb(93, 36, 72)
HSL
hsl(322, 44%, 25%)
HSB
hsb(322, 61%, 36%)
CMYK
cmyk(0%, 61%, 23%, 64%)
Oklch
oklch(35.6% 0.095 344.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFF5D0
D1DBFF

Analogous

FFDED1
FFF5D0
F2FFD1

Triadic

FFF5D0
D1FFF5
F5D1FF

Split-Comp.

FFF5D0
D1F2FF
DED1FF

Tetradic

FFF5D0
D1FFDE
D1DBFF
FFD1F2

Contrast Matrix WCAG 2.1 Contrast

FFF5D0
E7DE93
A680A0
7D5477
5D2448
—
1.3
Fail
3.1
AA Large
5.6
AA
10.6
AAA
1.3
Fail
—
2.5
Fail
4.5
AA Large
8.4
AAA
3.1
AA Large
2.5
Fail
—
1.8
Fail
3.4
AA Large
5.6
AA
4.5
AA Large
1.8
Fail
—
1.9
Fail
10.6
AAA
8.4
AAA
3.4
AA Large
1.9
Fail
—
White BG
1.1Fail
1.4Fail
3.4AA Large
6.2AA
11.6AAA
Black BG
19.2AAA
15.3AAA
6.2AA
3.4AA Large
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FBFBD9
E3E3A5
969598
6B6B6F
44443F

Deuteranopia

FBFCDB
E4E4AA
989B96
6E716D
484C3D

Tritanopia

FFE0E2
E7B3B7
A49291
7B6866
5A3837

Achromatopsia

F4F4F4
D8D8D8
8F8F8F
646464
393939

Shades & Tints Shades & Tints

#FFF5D0

Dark
Light

#E7DE93

Dark
Light

#A680A0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fff5d0;
  --color-2: #e7de93;
  --color-3: #a680a0;
  --color-4: #7d5477;
  --color-5: #5d2448;
}

SCSS

$color-1: #fff5d0;
$color-2: #e7de93;
$color-3: #a680a0;
$color-4: #7d5477;
$color-5: #5d2448;

TAILWIND

colors: {
  'brand-1': '#fff5d0',
  'brand-2': '#e7de93',
  'brand-3': '#a680a0',
  'brand-4': '#7d5477',
  'brand-5': '#5d2448',
}

RGB Array

[255, 245, 208], [231, 222, 147], [166, 128, 160], [125, 84, 119], [93, 36, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFF5D0, #E7DE93, #A680A0, #7D5477, #5D2448 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #fff5d0; --color-2: #e7de93; --color-3: #a680a0; --color-4: #7d5477; --color-5: #5d2448. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. High-contrast palettes naturally meet WCAG accessibility standards. 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 general-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