← Back to Editor

#D99762 · #EC6E54 · #FF4F4F · #784642 · #3F695C

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 MenuPoster

Color Details Color Details

#D99762

Apricot · DarkSalmon · Warm Sun

HEX
#D99762
RGB
rgb(217, 151, 98)
HSL
hsl(27, 61%, 62%)
HSB
hsb(27, 55%, 85%)
CMYK
cmyk(0%, 30%, 55%, 15%)
Oklch
oklch(73.0% 0.105 58.9)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#EC6E54

Peach Pink · Tomato · Coral Red

HEX
#EC6E54
RGB
rgb(236, 110, 84)
HSL
hsl(10, 80%, 63%)
HSB
hsb(10, 64%, 93%)
CMYK
cmyk(0%, 53%, 64%, 7%)
Oklch
oklch(68.4% 0.162 33.2)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#FF4F4F

Peach Pink · Tomato · Coral Red

HEX
#FF4F4F
RGB
rgb(255, 79, 79)
HSL
hsl(0, 100%, 65%)
HSB
hsb(0, 69%, 100%)
CMYK
cmyk(0%, 69%, 69%, 0%)
Oklch
oklch(67.5% 0.213 24.9)

TraditionalPeach Pink」· PaintCoral Red」· Creative Blush Sunrise

#784642

Crimson · Sienna · Wine Red

HEX
#784642
RGB
rgb(120, 70, 66)
HSL
hsl(4, 29%, 36%)
HSB
hsb(4, 45%, 47%)
CMYK
cmyk(0%, 42%, 45%, 53%)
Oklch
oklch(45.2% 0.070 25.1)

TraditionalCrimson」· PaintWine Red」· Creative Blush Sunrise

#3F695C

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#3F695C
RGB
rgb(63, 105, 92)
HSL
hsl(161, 25%, 33%)
HSB
hsb(161, 40%, 41%)
CMYK
cmyk(40%, 0%, 12%, 59%)
Oklch
oklch(48.6% 0.052 172.4)

TraditionalMineral Blue」· PaintMint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D99762
63A4D9

Analogous

D96369
D99762
D9D363

Triadic

D99762
63D998
9863D9

Split-Comp.

D99762
63D9D3
6369D9

Tetradic

D99762
69D963
63A4D9
D363D9

Contrast Matrix WCAG 2.1 Contrast

D99762
EC6E54
FF4F4F
784642
3F695C
1.2
Fail
1.3
Fail
3.1
AA Large
2.5
Fail
1.2
Fail
1.1
Fail
2.5
Fail
2.0
Fail
1.3
Fail
1.1
Fail
2.4
Fail
1.9
Fail
3.1
AA Large
2.5
Fail
2.4
Fail
1.2
Fail
2.5
Fail
2.0
Fail
1.9
Fail
1.2
Fail
White BG
2.5Fail
3.0AA Large
3.2AA Large
7.6AAA
6.2AA
Black BG
8.6AAA
6.9AA
6.5AA
2.8Fail
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

BCBC6F
B5B45A
B3B14F
626243
51525F

Deuteranopia

C0C572
BDC65C
BDCA4F
656943
4F4C60

Tritanopia

D6797B
E65F60
F64F4F
764444
416262

Achromatopsia

A5A5A5
919191
848484
545454
5B5B5B

Shades & Tints Shades & Tints

#D99762

Dark
Light

#EC6E54

Dark
Light

#FF4F4F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d99762;
  --color-2: #ec6e54;
  --color-3: #ff4f4f;
  --color-4: #784642;
  --color-5: #3f695c;
}

SCSS

$color-1: #d99762;
$color-2: #ec6e54;
$color-3: #ff4f4f;
$color-4: #784642;
$color-5: #3f695c;

TAILWIND

colors: {
  'brand-1': '#d99762',
  'brand-2': '#ec6e54',
  'brand-3': '#ff4f4f',
  'brand-4': '#784642',
  'brand-5': '#3f695c',
}

RGB Array

[217, 151, 98], [236, 110, 84], [255, 79, 79], [120, 70, 66], [63, 105, 92]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #D99762, #EC6E54, #FF4F4F, #784642, #3F695C is ideal for: corporate websites, product showcases, portfolios. 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: #d99762; --color-2: #ec6e54; --color-3: #ff4f4f; --color-4: #784642; --color-5: #3f695c. 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. 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. 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