← Back to Editor

#493F39 · #BF565D · #A09A97 · #ABB9A3 · #F0DFC7

vintage

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

NostalgicClassicTimelessWarm

Industry INDUSTRY

CafePublishingCraft

UI Context UI CONTEXT

StorefrontDigital MenuPosterData Visualization

Color Details Color Details

#493F39

Tangerine · DarkSlateGray · Cinnamon

HEX
#493F39
RGB
rgb(73, 63, 57)
HSL
hsl(23, 12%, 25%)
HSB
hsb(23, 22%, 29%)
CMYK
cmyk(0%, 14%, 22%, 71%)
Oklch
oklch(37.6% 0.017 52.9)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#BF565D

Crimson · Sienna · Passion Red

HEX
#BF565D
RGB
rgb(191, 86, 93)
HSL
hsl(356, 45%, 54%)
HSB
hsb(356, 55%, 75%)
CMYK
cmyk(0%, 55%, 51%, 25%)
Oklch
oklch(58.7% 0.135 18.1)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#A09A97

Ash · DarkGray · Silver Sand

HEX
#A09A97
RGB
rgb(160, 154, 151)
HSL
hsl(20, 5%, 61%)
HSB
hsb(20, 6%, 63%)
CMYK
cmyk(0%, 4%, 6%, 37%)
Oklch
oklch(69.0% 0.008 48.6)

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

#ABB9A3

Celadon · DarkGray · Apple Green

HEX
#ABB9A3
RGB
rgb(171, 185, 163)
HSL
hsl(98, 14%, 68%)
HSB
hsb(98, 12%, 73%)
CMYK
cmyk(8%, 0%, 12%, 27%)
Oklch
oklch(76.9% 0.034 134.0)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#F0DFC7

Goose Yellow · Bisque · Peach Orange

HEX
#F0DFC7
RGB
rgb(240, 223, 199)
HSL
hsl(35, 58%, 86%)
HSB
hsb(35, 17%, 94%)
CMYK
cmyk(0%, 7%, 17%, 6%)
Oklch
oklch(91.1% 0.037 76.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

493F39
384247

Analogous

47383A
493F39
474638

Triadic

493F39
38473E
3E3847

Split-Comp.

493F39
384746
383A47

Tetradic

493F39
3A4738
384247
463847

Contrast Matrix WCAG 2.1 Contrast

493F39
BF565D
A09A97
ABB9A3
F0DFC7
—
2.3
Fail
3.7
AA Large
5.0
AA
7.8
AAA
2.3
Fail
—
1.6
Fail
2.2
Fail
3.4
AA Large
3.7
AA Large
1.6
Fail
—
1.3
Fail
2.1
Fail
5.0
AA
2.2
Fail
1.3
Fail
—
1.6
Fail
7.8
AAA
3.4
AA Large
2.1
Fail
1.6
Fail
—
White BG
10.2AAA
4.5AA Large
2.8Fail
2.1Fail
1.3Fail
Black BG
2.1Fail
4.7AA
7.6AAA
10.2AAA
16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

45453A
92915B
9D9D98
B1B1A8
E9E8CD

Deuteranopia

45463B
98A05B
9E9E98
B0AFAA
EAEBCE

Tritanopia

493C3C
BA5A5A
A09898
ACADAD
EFD1D2

Achromatopsia

414141
767676
9B9B9B
B2B2B2
E1E1E1

Shades & Tints Shades & Tints

#493F39

Dark
Light

#BF565D

Dark
Light

#A09A97

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #493f39;
  --color-2: #bf565d;
  --color-3: #a09a97;
  --color-4: #abb9a3;
  --color-5: #f0dfc7;
}

SCSS

$color-1: #493f39;
$color-2: #bf565d;
$color-3: #a09a97;
$color-4: #abb9a3;
$color-5: #f0dfc7;

TAILWIND

colors: {
  'brand-1': '#493f39',
  'brand-2': '#bf565d',
  'brand-3': '#a09a97',
  'brand-4': '#abb9a3',
  'brand-5': '#f0dfc7',
}

RGB Array

[73, 63, 57], [191, 86, 93], [160, 154, 151], [171, 185, 163], [240, 223, 199]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #493F39, #BF565D, #A09A97, #ABB9A3, #F0DFC7 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: #493f39; --color-2: #bf565d; --color-3: #a09a97; --color-4: #abb9a3; --color-5: #f0dfc7. 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