← Back to Editor

#F2B035 · #F7DA5A · #A7BB44 · #43997F · #D24B3E

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

#F2B035

Ginger · GoldenRod · Warm Sun

HEX
#F2B035
RGB
rgb(242, 176, 53)
HSL
hsl(39, 88%, 58%)
HSB
hsb(39, 78%, 95%)
CMYK
cmyk(0%, 27%, 78%, 5%)
Oklch
oklch(80.0% 0.151 78.2)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#F7DA5A

Ginger · Khaki · Sunflower

HEX
#F7DA5A
RGB
rgb(247, 218, 90)
HSL
hsl(49, 91%, 66%)
HSB
hsb(49, 64%, 97%)
CMYK
cmyk(0%, 12%, 64%, 3%)
Oklch
oklch(88.9% 0.148 96.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#A7BB44

Grass Green · GoldenRod · Olive Green

HEX
#A7BB44
RGB
rgb(167, 187, 68)
HSL
hsl(70, 47%, 50%)
HSB
hsb(70, 64%, 73%)
CMYK
cmyk(11%, 0%, 64%, 27%)
Oklch
oklch(75.4% 0.145 118.1)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#43997F

Mineral Blue · MediumSeaGreen · Mint Ice

HEX
#43997F
RGB
rgb(67, 153, 127)
HSL
hsl(162, 39%, 43%)
HSB
hsb(162, 56%, 60%)
CMYK
cmyk(56%, 0%, 17%, 40%)
Oklch
oklch(62.3% 0.093 170.6)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#D24B3E

Vermilion · Chocolate · Passion Red

HEX
#D24B3E
RGB
rgb(210, 75, 62)
HSL
hsl(5, 62%, 53%)
HSB
hsb(5, 70%, 82%)
CMYK
cmyk(0%, 64%, 70%, 18%)
Oklch
oklch(59.6% 0.173 28.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2B035
3678F2

Analogous

F25236
F2B035
D6F236

Triadic

F2B035
36F2B0
B036F2

Split-Comp.

F2B035
36D6F2
5236F2

Tetradic

F2B035
36F252
3678F2
F236D6

Contrast Matrix WCAG 2.1 Contrast

F2B035
F7DA5A
A7BB44
43997F
D24B3E
—
1.4
Fail
1.1
Fail
1.8
Fail
2.3
Fail
1.4
Fail
—
1.5
Fail
2.5
Fail
3.1
AA Large
1.1
Fail
1.5
Fail
—
1.6
Fail
2.0
Fail
1.8
Fail
2.5
Fail
1.6
Fail
—
1.3
Fail
2.3
Fail
3.1
AA Large
2.0
Fail
1.3
Fail
—
White BG
1.9Fail
1.4Fail
2.1Fail
3.4AA Large
4.4AA Large
Black BG
11.0AAA
15.1AAA
9.8AAA
6.1AA
4.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D5D553
EAEA79
B0B061
686985
989641

Deuteranopia

D9DE5A
ECEE80
AFAD68
635D87
9FAA42

Tritanopia

EF6A6F
F69197
A8787D
478A8B
CB4444

Achromatopsia

B6B6B6
D4D4D4
A7A7A7
7C7C7C
727272

Shades & Tints Shades & Tints

#F2B035

Dark
Light

#F7DA5A

Dark
Light

#A7BB44

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2b035;
  --color-2: #f7da5a;
  --color-3: #a7bb44;
  --color-4: #43997f;
  --color-5: #d24b3e;
}

SCSS

$color-1: #f2b035;
$color-2: #f7da5a;
$color-3: #a7bb44;
$color-4: #43997f;
$color-5: #d24b3e;

TAILWIND

colors: {
  'brand-1': '#f2b035',
  'brand-2': '#f7da5a',
  'brand-3': '#a7bb44',
  'brand-4': '#43997f',
  'brand-5': '#d24b3e',
}

RGB Array

[242, 176, 53], [247, 218, 90], [167, 187, 68], [67, 153, 127], [210, 75, 62]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This vintage-style palette of #F2B035, #F7DA5A, #A7BB44, #43997F, #D24B3E is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. 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: #f2b035; --color-2: #f7da5a; --color-3: #a7bb44; --color-4: #43997f; --color-5: #d24b3e. 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 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