← Back to Editor

#F5F7EA · #7A6495 · #86397D · #8C0E34 · #360C10

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#F5F7EA

Fresh Green · Linen · Lemon Cream

HEX
#F5F7EA
RGB
rgb(245, 247, 234)
HSL
hsl(69, 45%, 94%)
HSB
hsb(69, 5%, 97%)
CMYK
cmyk(1%, 0%, 5%, 3%)
Oklch
oklch(97.1% 0.017 113.8)

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

#7A6495

Deep Indigo · SlateGray · Violet

HEX
#7A6495
RGB
rgb(122, 100, 149)
HSL
hsl(267, 20%, 49%)
HSB
hsb(267, 33%, 58%)
CMYK
cmyk(18%, 33%, 0%, 42%)
Oklch
oklch(54.4% 0.079 304.5)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

#86397D

Rose Purple · Purple · Eggplant

HEX
#86397D
RGB
rgb(134, 57, 125)
HSL
hsl(307, 40%, 37%)
HSB
hsb(307, 57%, 53%)
CMYK
cmyk(0%, 57%, 7%, 47%)
Oklch
oklch(47.3% 0.137 332.2)

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

#8C0E34

Dark Violet · Brown · Camellia

HEX
#8C0E34
RGB
rgb(140, 14, 52)
HSL
hsl(342, 82%, 30%)
HSB
hsb(342, 90%, 55%)
CMYK
cmyk(0%, 90%, 63%, 45%)
Oklch
oklch(41.5% 0.157 12.1)

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

#360C10

Vermilion · Black · Deep Berry

HEX
#360C10
RGB
rgb(54, 12, 16)
HSL
hsl(354, 64%, 13%)
HSB
hsb(354, 78%, 21%)
CMYK
cmyk(0%, 78%, 70%, 79%)
Oklch
oklch(23.0% 0.067 18.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F5F7EA
EBE9F7

Analogous

F7F2E9
F5F7EA
EEF7E9

Triadic

F5F7EA
E9F5F7
F7E9F5

Split-Comp.

F5F7EA
E9EEF7
F2E9F7

Tetradic

F5F7EA
E9F7F2
EBE9F7
F7E9EE

Contrast Matrix WCAG 2.1 Contrast

F5F7EA
7A6495
86397D
8C0E34
360C10
—
4.7
AA
6.7
AA
8.7
AAA
15.9
AAA
4.7
AA
—
1.4
Fail
1.8
Fail
3.4
AA Large
6.7
AA
1.4
Fail
—
1.3
Fail
2.4
Fail
8.7
AAA
1.8
Fail
1.3
Fail
—
1.8
Fail
15.9
AAA
3.4
AA Large
2.4
Fail
1.8
Fail
—
White BG
1.1Fail
5.1AA
7.3AAA
9.4AAA
17.3AAA
Black BG
19.4AAA
4.1AA Large
2.9Fail
2.2Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F6F6ED
707089
65646D
55542B
24230F

Deuteranopia

F6F6EE
727386
696F69
5D6629
26290F

Tritanopia

F5F0F0
79807E
82605D
862422
340E0E

Achromatopsia

F5F5F5
707070
585858
383838
191919

Shades & Tints Shades & Tints

#F5F7EA

Dark
Light

#7A6495

Dark
Light

#86397D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f5f7ea;
  --color-2: #7a6495;
  --color-3: #86397d;
  --color-4: #8c0e34;
  --color-5: #360c10;
}

SCSS

$color-1: #f5f7ea;
$color-2: #7a6495;
$color-3: #86397d;
$color-4: #8c0e34;
$color-5: #360c10;

TAILWIND

colors: {
  'brand-1': '#f5f7ea',
  'brand-2': '#7a6495',
  'brand-3': '#86397d',
  'brand-4': '#8c0e34',
  'brand-5': '#360c10',
}

RGB Array

[245, 247, 234], [122, 100, 149], [134, 57, 125], [140, 14, 52], [54, 12, 16]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F5F7EA, #7A6495, #86397D, #8C0E34, #360C10 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: #f5f7ea; --color-2: #7a6495; --color-3: #86397d; --color-4: #8c0e34; --color-5: #360c10. 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