← Back to Editor

#702660 · #D3376E · #F59941 · #F8B4BB · #DDA8D3

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

#702660

Rose Purple · Purple · Eggplant

HEX
#702660
RGB
rgb(112, 38, 96)
HSL
hsl(313, 49%, 29%)
HSB
hsb(313, 66%, 44%)
CMYK
cmyk(0%, 66%, 14%, 56%)
Oklch
oklch(40.1% 0.127 337.2)

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

#D3376E

Dark Violet · MediumVioletRed · Rose Pink

HEX
#D3376E
RGB
rgb(211, 55, 110)
HSL
hsl(339, 64%, 52%)
HSB
hsb(339, 74%, 83%)
CMYK
cmyk(0%, 74%, 48%, 17%)
Oklch
oklch(58.7% 0.195 4.4)

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

#F59941

Apricot · Coral · Warm Sun

HEX
#F59941
RGB
rgb(245, 153, 65)
HSL
hsl(29, 90%, 61%)
HSB
hsb(29, 73%, 96%)
CMYK
cmyk(0%, 38%, 73%, 4%)
Oklch
oklch(76.2% 0.149 60.7)

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

#F8B4BB

Peach Pink · LightPink · Cherry Blossom

HEX
#F8B4BB
RGB
rgb(248, 180, 187)
HSL
hsl(354, 83%, 84%)
HSB
hsb(354, 27%, 97%)
CMYK
cmyk(0%, 27%, 25%, 3%)
Oklch
oklch(83.5% 0.080 12.1)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#DDA8D3

Mauve · LightPink · Lilac Purple

HEX
#DDA8D3
RGB
rgb(221, 168, 211)
HSL
hsl(311, 44%, 76%)
HSB
hsb(311, 24%, 87%)
CMYK
cmyk(0%, 24%, 5%, 13%)
Oklch
oklch(79.4% 0.084 333.0)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

702660
266E35

Analogous

5A266E
702660
6E263A

Triadic

702660
5E6E26
265E6E

Split-Comp.

702660
3A6E26
266E5A

Tetradic

702660
6E5A26
266E35
263A6E

Contrast Matrix WCAG 2.1 Contrast

702660
D3376E
F59941
F8B4BB
DDA8D3
—
2.1
Fail
4.5
AA Large
5.7
AA
5.0
AA
2.1
Fail
—
2.1
Fail
2.7
Fail
2.3
Fail
4.5
AA Large
2.1
Fail
—
1.3
Fail
1.1
Fail
5.7
AA
2.7
Fail
1.3
Fail
—
1.2
Fail
5.0
AA
2.3
Fail
1.1
Fail
1.2
Fail
—
White BG
9.8AAA
4.6AA
2.2Fail
1.7Fail
2.0Fail
Black BG
2.1Fail
4.5AA
9.5AAA
12.2AAA
10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

504F52
8F8E61
CDCC56
DBDAB9
C6C6C9

Deuteranopia

545A4F
99A45E
D3D95B
DFE4B9
C9CDC6

Tritanopia

6C4744
CB5654
F0676B
F5B8B8
DAC0BF

Achromatopsia

434343
6C6C6C
AAAAAA
C9C9C9
BDBDBD

Shades & Tints Shades & Tints

#702660

Dark
Light

#D3376E

Dark
Light

#F59941

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #702660;
  --color-2: #d3376e;
  --color-3: #f59941;
  --color-4: #f8b4bb;
  --color-5: #dda8d3;
}

SCSS

$color-1: #702660;
$color-2: #d3376e;
$color-3: #f59941;
$color-4: #f8b4bb;
$color-5: #dda8d3;

TAILWIND

colors: {
  'brand-1': '#702660',
  'brand-2': '#d3376e',
  'brand-3': '#f59941',
  'brand-4': '#f8b4bb',
  'brand-5': '#dda8d3',
}

RGB Array

[112, 38, 96], [211, 55, 110], [245, 153, 65], [248, 180, 187], [221, 168, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #702660, #D3376E, #F59941, #F8B4BB, #DDA8D3 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: #702660; --color-2: #d3376e; --color-3: #f59941; --color-4: #f8b4bb; --color-5: #dda8d3. 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