← Back to Editor

#F1E0B2 · #D2AC7F · #D67B69 · #C24F54 · #8D2A58

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

#F1E0B2

Goose Yellow · Wheat · Lemon Cream

HEX
#F1E0B2
RGB
rgb(241, 224, 178)
HSL
hsl(44, 69%, 82%)
HSB
hsb(44, 26%, 95%)
CMYK
cmyk(0%, 7%, 26%, 5%)
Oklch
oklch(90.9% 0.063 90.2)

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

#D2AC7F

Ginger · Tan · Warm Sun

HEX
#D2AC7F
RGB
rgb(210, 172, 127)
HSL
hsl(33, 48%, 66%)
HSB
hsb(33, 40%, 82%)
CMYK
cmyk(0%, 18%, 40%, 18%)
Oklch
oklch(76.8% 0.075 71.1)

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

#D67B69

Peach Pink · LightCoral · Coral Red

HEX
#D67B69
RGB
rgb(214, 123, 105)
HSL
hsl(10, 57%, 63%)
HSB
hsb(10, 51%, 84%)
CMYK
cmyk(0%, 43%, 51%, 16%)
Oklch
oklch(67.8% 0.117 32.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#C24F54

Crimson · Sienna · Passion Red

HEX
#C24F54
RGB
rgb(194, 79, 84)
HSL
hsl(357, 49%, 54%)
HSB
hsb(357, 59%, 76%)
CMYK
cmyk(0%, 59%, 57%, 24%)
Oklch
oklch(57.9% 0.148 20.3)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#8D2A58

Dark Violet · Brown · Camellia

HEX
#8D2A58
RGB
rgb(141, 42, 88)
HSL
hsl(332, 54%, 36%)
HSB
hsb(332, 70%, 55%)
CMYK
cmyk(0%, 70%, 38%, 45%)
Oklch
oklch(45.0% 0.140 355.8)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F1E0B2
B1C2F1

Analogous

F1C0B1
F1E0B2
E2F1B1

Triadic

F1E0B2
B1F1E0
E0B1F1

Split-Comp.

F1E0B2
B1E2F1
C0B1F1

Tetradic

F1E0B2
B1F1C0
B1C2F1
F1B1E2

Contrast Matrix WCAG 2.1 Contrast

F1E0B2
D2AC7F
D67B69
C24F54
8D2A58
—
1.6
Fail
2.3
Fail
3.5
AA Large
6.2
AA
1.6
Fail
—
1.4
Fail
2.2
Fail
3.8
AA Large
2.3
Fail
1.4
Fail
—
1.5
Fail
2.6
Fail
3.5
AA Large
2.2
Fail
1.5
Fail
—
1.7
Fail
6.2
AA
3.8
AA Large
2.6
Fail
1.7
Fail
—
White BG
1.3Fail
2.1Fail
3.0AA Large
4.6AA
8.1AAA
Black BG
16.0AAA
9.9AAA
6.9AA
4.5AA
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EAE9BD
C2C18A
AFAE6D
908F53
62614D

Deuteranopia

EBECC0
C4C78D
B4BB6E
979F53
686F4A

Tritanopia

F0C6C8
D09294
D17172
BC5252
884442

Achromatopsia

E0E0E0
B2B2B2
949494
727272
4D4D4D

Shades & Tints Shades & Tints

#F1E0B2

Dark
Light

#D2AC7F

Dark
Light

#D67B69

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f1e0b2;
  --color-2: #d2ac7f;
  --color-3: #d67b69;
  --color-4: #c24f54;
  --color-5: #8d2a58;
}

SCSS

$color-1: #f1e0b2;
$color-2: #d2ac7f;
$color-3: #d67b69;
$color-4: #c24f54;
$color-5: #8d2a58;

TAILWIND

colors: {
  'brand-1': '#f1e0b2',
  'brand-2': '#d2ac7f',
  'brand-3': '#d67b69',
  'brand-4': '#c24f54',
  'brand-5': '#8d2a58',
}

RGB Array

[241, 224, 178], [210, 172, 127], [214, 123, 105], [194, 79, 84], [141, 42, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F1E0B2, #D2AC7F, #D67B69, #C24F54, #8D2A58 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: #f1e0b2; --color-2: #d2ac7f; --color-3: #d67b69; --color-4: #c24f54; --color-5: #8d2a58. 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