← Back to Editor

#070E46 · #212B73 · #753686 · #C84299 · #F277C7

vintage

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarmCool

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPosterData Visualization

Color Details Color Details

#070E46

Indigo · MidnightBlue · Deep Sea Blue

HEX
#070E46
RGB
rgb(7, 14, 70)
HSL
hsl(233, 82%, 15%)
HSB
hsb(233, 90%, 27%)
CMYK
cmyk(90%, 80%, 0%, 73%)
Oklch
oklch(20.9% 0.103 268.6)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#212B73

Indigo · MidnightBlue · Prussian Blue

HEX
#212B73
RGB
rgb(33, 43, 115)
HSL
hsl(233, 55%, 29%)
HSB
hsb(233, 71%, 45%)
CMYK
cmyk(71%, 63%, 0%, 55%)
Oklch
oklch(32.9% 0.123 271.7)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#753686

Dark Plum · DarkSlateBlue · Eggplant

HEX
#753686
RGB
rgb(117, 54, 134)
HSL
hsl(287, 43%, 37%)
HSB
hsb(287, 60%, 53%)
CMYK
cmyk(13%, 60%, 0%, 47%)
Oklch
oklch(45.1% 0.140 318.6)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#C84299

Rose Purple · MediumVioletRed · Rose Pink

HEX
#C84299
RGB
rgb(200, 66, 153)
HSL
hsl(321, 55%, 52%)
HSB
hsb(321, 67%, 78%)
CMYK
cmyk(0%, 67%, 24%, 22%)
Oklch
oklch(59.5% 0.192 344.6)

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

#F277C7

Mauve · Orchid · Rose Pink

HEX
#F277C7
RGB
rgb(242, 119, 199)
HSL
hsl(321, 83%, 71%)
HSB
hsb(321, 51%, 95%)
CMYK
cmyk(0%, 51%, 18%, 5%)
Oklch
oklch(73.6% 0.176 342.6)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

070E46
463E07

Analogous

072E46
070E46
1F0746

Triadic

070E46
46070E
0E4607

Split-Comp.

070E46
461F07
2E4607

Tetradic

070E46
46072E
463E07
07461F

Contrast Matrix WCAG 2.1 Contrast

070E46
212B73
753686
C84299
F277C7
—
1.4
Fail
2.3
Fail
4.0
AA Large
7.1
AAA
1.4
Fail
—
1.6
Fail
2.8
Fail
5.0
AA
2.3
Fail
1.6
Fail
—
1.8
Fail
3.1
AA Large
4.0
AA Large
2.8
Fail
1.8
Fail
—
1.8
Fail
7.1
AAA
5.0
AA
3.1
AA Large
1.8
Fail
—
White BG
18.1AAA
12.7AAA
8.0AAA
4.5AA Large
2.5Fail
Black BG
1.2Fail
1.7Fail
2.6Fail
4.7AA
8.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0A0A38
252562
5A5973
8E8D84
BDBCB4

Deuteranopia

0A0935
25245D
5D626E
96A07F
C4CDAF

Tritanopia

072E2B
225451
726360
C17370
ECA4A1

Achromatopsia

121212
303030
525252
747474
A5A5A5

Shades & Tints Shades & Tints

#070E46

Dark
Light

#212B73

Dark
Light

#753686

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #070e46;
  --color-2: #212b73;
  --color-3: #753686;
  --color-4: #c84299;
  --color-5: #f277c7;
}

SCSS

$color-1: #070e46;
$color-2: #212b73;
$color-3: #753686;
$color-4: #c84299;
$color-5: #f277c7;

TAILWIND

colors: {
  'brand-1': '#070e46',
  'brand-2': '#212b73',
  'brand-3': '#753686',
  'brand-4': '#c84299',
  'brand-5': '#f277c7',
}

RGB Array

[7, 14, 70], [33, 43, 115], [117, 54, 134], [200, 66, 153], [242, 119, 199]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #070E46, #212B73, #753686, #C84299, #F277C7 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: #070e46; --color-2: #212b73; --color-3: #753686; --color-4: #c84299; --color-5: #f277c7. 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 vintage-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