← Back to Editor

#345075 · #6D7F89 · #A7AAA3 · #CEC2A8 · #ECCEA8

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

#345075

Indigo · DarkSlateBlue · Prussian Blue

HEX
#345075
RGB
rgb(52, 80, 117)
HSL
hsl(214, 38%, 33%)
HSB
hsb(214, 56%, 46%)
CMYK
cmyk(56%, 32%, 0%, 54%)
Oklch
oklch(42.6% 0.071 255.8)

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

#6D7F89

Slate Blue · SlateGray · Navy Blue

HEX
#6D7F89
RGB
rgb(109, 127, 137)
HSL
hsl(201, 11%, 48%)
HSB
hsb(201, 20%, 54%)
CMYK
cmyk(20%, 7%, 0%, 46%)
Oklch
oklch(58.5% 0.026 232.2)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#A7AAA3

Ash · DarkGray · Silver Sand

HEX
#A7AAA3
RGB
rgb(167, 170, 163)
HSL
hsl(86, 4%, 65%)
HSB
hsb(86, 4%, 67%)
CMYK
cmyk(2%, 0%, 4%, 33%)
Oklch
oklch(73.4% 0.010 125.7)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#CEC2A8

Goose Yellow · Silver · Sunflower

HEX
#CEC2A8
RGB
rgb(206, 194, 168)
HSL
hsl(41, 28%, 73%)
HSB
hsb(41, 18%, 81%)
CMYK
cmyk(0%, 6%, 18%, 19%)
Oklch
oklch(81.7% 0.038 86.2)

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

#ECCEA8

Goose Yellow · Wheat · Peach Orange

HEX
#ECCEA8
RGB
rgb(236, 206, 168)
HSL
hsl(34, 64%, 79%)
HSB
hsb(34, 29%, 93%)
CMYK
cmyk(0%, 13%, 29%, 7%)
Oklch
oklch(86.7% 0.060 73.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

345075
745834

Analogous

347074
345075
383474

Triadic

345075
743450
507434

Split-Comp.

345075
743834
707434

Tetradic

345075
743470
745834
347438

Contrast Matrix WCAG 2.1 Contrast

345075
6D7F89
A7AAA3
CEC2A8
ECCEA8
—
2.0
Fail
3.5
AA Large
4.7
AA
5.5
AA
2.0
Fail
—
1.8
Fail
2.4
Fail
2.8
Fail
3.5
AA Large
1.8
Fail
—
1.3
Fail
1.6
Fail
4.7
AA
2.4
Fail
1.3
Fail
—
1.2
Fail
5.5
AA
2.8
Fail
1.6
Fail
1.2
Fail
—
White BG
8.2AAA
4.2AA Large
2.4Fail
1.8Fail
1.5Fail
Black BG
2.6Fail
5.0AA
8.9AAA
11.9AAA
14.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

40406C
757587
A8A8A5
C9C9AE
DFDFB1

Deuteranopia

3F3C6A
747286
A8A8A5
CACAB0
E1E3B3

Tritanopia

356563
6E8584
A7A6A6
CDB3B4
EBB8BA

Achromatopsia

4C4C4C
7B7B7B
A8A8A8
C3C3C3
D3D3D3

Shades & Tints Shades & Tints

#345075

Dark
Light

#6D7F89

Dark
Light

#A7AAA3

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #345075;
  --color-2: #6d7f89;
  --color-3: #a7aaa3;
  --color-4: #cec2a8;
  --color-5: #eccea8;
}

SCSS

$color-1: #345075;
$color-2: #6d7f89;
$color-3: #a7aaa3;
$color-4: #cec2a8;
$color-5: #eccea8;

TAILWIND

colors: {
  'brand-1': '#345075',
  'brand-2': '#6d7f89',
  'brand-3': '#a7aaa3',
  'brand-4': '#cec2a8',
  'brand-5': '#eccea8',
}

RGB Array

[52, 80, 117], [109, 127, 137], [167, 170, 163], [206, 194, 168], [236, 206, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #345075, #6D7F89, #A7AAA3, #CEC2A8, #ECCEA8 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #345075; --color-2: #6d7f89; --color-3: #a7aaa3; --color-4: #cec2a8; --color-5: #eccea8. 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 tech, SaaS, healthcare, eco industries. Restrained colors convey professionalism and trust. 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