← Back to Editor

#321A1A · #FFE4C5 · #E43462 · #E7C087 · #F1E7C3

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#321A1A

Crimson · Black · Deep Berry

HEX
#321A1A
RGB
rgb(50, 26, 26)
HSL
hsl(0, 32%, 15%)
HSB
hsb(0, 48%, 20%)
CMYK
cmyk(0%, 48%, 48%, 80%)
Oklch
oklch(25.1% 0.038 20.1)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

#FFE4C5

Goose Yellow · Bisque · Peach Orange

HEX
#FFE4C5
RGB
rgb(255, 228, 197)
HSL
hsl(32, 100%, 89%)
HSB
hsb(32, 23%, 100%)
CMYK
cmyk(0%, 11%, 23%, 0%)
Oklch
oklch(93.3% 0.050 71.0)

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

#E43462

Dark Violet · Crimson · Rose Pink

HEX
#E43462
RGB
rgb(228, 52, 98)
HSL
hsl(344, 77%, 55%)
HSB
hsb(344, 77%, 89%)
CMYK
cmyk(0%, 77%, 57%, 11%)
Oklch
oklch(61.0% 0.211 11.5)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#E7C087

Goose Yellow · BurlyWood · Warm Sun

HEX
#E7C087
RGB
rgb(231, 192, 135)
HSL
hsl(36, 67%, 72%)
HSB
hsb(36, 42%, 91%)
CMYK
cmyk(0%, 17%, 42%, 9%)
Oklch
oklch(82.9% 0.086 76.6)

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

#F1E7C3

Goose Yellow · Bisque · Lemon Cream

HEX
#F1E7C3
RGB
rgb(241, 231, 195)
HSL
hsl(47, 62%, 85%)
HSB
hsb(47, 19%, 95%)
CMYK
cmyk(0%, 4%, 19%, 5%)
Oklch
oklch(92.7% 0.048 94.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

321A1A
1A3232

Analogous

321A26
321A1A
32261A

Triadic

321A1A
1A321A
1A1A32

Split-Comp.

321A1A
1A3226
1A2632

Tetradic

321A1A
26321A
1A3232
261A32

Contrast Matrix WCAG 2.1 Contrast

321A1A
FFE4C5
E43462
E7C087
F1E7C3
—
13.2
AAA
3.8
AA Large
9.5
AAA
13.1
AAA
13.2
AAA
—
3.5
AA Large
1.4
Fail
1.0
Fail
3.8
AA Large
3.5
AA Large
—
2.5
Fail
3.4
AA Large
9.5
AAA
1.4
Fail
2.5
Fail
—
1.4
Fail
13.1
AAA
1.0
Fail
3.4
AA Large
1.4
Fail
—
White BG
16.2AAA
1.2Fail
4.2AA Large
1.7Fail
1.2Fail
Black BG
1.3Fail
17.2AAA
5.0AA
12.3AAA
17.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

28271A
F3F3CD
989657
D6D695
EDEDCC

Deuteranopia

292B1A
F5F7CE
A2AF54
D8DB98
EDEECE

Tritanopia

311A1A
FED2D4
DB4E4C
E5A0A2
F1D3D4

Achromatopsia

212121
E9E9E9
6E6E6E
C5C5C5
E6E6E6

Shades & Tints Shades & Tints

#321A1A

Dark
Light

#FFE4C5

Dark
Light

#E43462

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #321a1a;
  --color-2: #ffe4c5;
  --color-3: #e43462;
  --color-4: #e7c087;
  --color-5: #f1e7c3;
}

SCSS

$color-1: #321a1a;
$color-2: #ffe4c5;
$color-3: #e43462;
$color-4: #e7c087;
$color-5: #f1e7c3;

TAILWIND

colors: {
  'brand-1': '#321a1a',
  'brand-2': '#ffe4c5',
  'brand-3': '#e43462',
  'brand-4': '#e7c087',
  'brand-5': '#f1e7c3',
}

RGB Array

[50, 26, 26], [255, 228, 197], [228, 52, 98], [231, 192, 135], [241, 231, 195]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #321A1A, #FFE4C5, #E43462, #E7C087, #F1E7C3 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #321a1a; --color-2: #ffe4c5; --color-3: #e43462; --color-4: #e7c087; --color-5: #f1e7c3. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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