Amongst the great color scheme options for websites, the vintage color palette has a special place. Vintage nuances combine in a retro color palette. As a result, the website has an attractive look through this very choice of hues. Visitors are warmly invited into a special atmosphere: a time and scene with a special allure…
The following selection of websites with vintage color palettes is intended to inspire you in creating your own website color combination. One or another might be the starting point in selecting the right nuances for your retro-looking website.
Poc Sculpture
The website advertises the works of Pierro Caron. It couldn’t be more appropriate than to use a vintage color scheme. The base colors are cool colors, which put the photo in the homepage Hero somehow at a distance. Actually, the photo in itself suggests warmer colors (e.g. brown), but an overlay comes on top of it and sets a distance between the viewer and this scene.
Some white seems to connect the photo scene with the user, as it is present both in the background and the foreground, both in the image and the website logo. Also, the name of the sculptor is written in white.
Hardscapestc
The Hardscapestc website has a special vintage color palette: warm nuances are near cool ones, precisely brown versus blue. To the color scheme, vintage textures come to complete the look and feel of a retro design. Dark nuances surround the images and text that display on a light brown background, within a centered box. The accent color is blue, and it’s used only for the top bar, to create sharp contrast with the brown spread all over the page. Shadows and delimitators serve to accentuate the vintage look of the homepage, and put content into a certain context.
Sproutbox
The previous example referred to a combination of brown and blue. Now, SproutBox exemplifies a combination of brown and green. The effect is the same: a vintage-looking website which is pleasant to browse. It’s interesting that light grey and green are dominant, while darker green and brown are the accent colors. Green is used for the menu items, logo, CTAs, as well as in the image. Brown is used for the top bar, to balance the green in the page. The resultant color scheme is very simple and “aerated”, and nice to see.
Owltastic
This website has a totally different vintage color palette. It’s also a combination of blue and brown, but in different concentrations. Dark blue and light brown create a balance that’s hard to ignore. It gives a vintage look and seems modern through innovation, in the same time. Please notice the contrast between text color and background color, which favours legibility. Please note that the chromatic combination is very simple. It focuses on the already mentioned two colors: light brown for the top bar, logo and graphics in the background, and blue for the whole Hero image.
Boldandnoble
Bold & Noble justifies its name through every detail in the website design. The color scheme plays on the combination of a few simple colors that give pages a vintage look. The tones are, here too, ranging from grey to brown. For grey, there are different hues destined to different elements in the page, each marking a greater or lesser importance of the respective item. Next to grey, brown is another color that gives weight to elements in the page. Other colors appear here and there in the page, only to create better contours for the vintage color palette.
Magnetimarelli
Magnetimarelli is an exemplary vintage website. The “minimalist”, simple color scheme is formed of some tints of brown and black, and plenty of white. The photo in the Hero of the page has the aspect of an image from old photo albums (in black and white). Otherwise, color is scarce. It’s present just to help people identify some symbols into the page. The great amount of white space serves to the easy identification of the page items. Also, it stirs up curiosity as to what follows in the page. Oddly, the reduction of color adds up to the page expressiveness: users can almost wait for the photo to “get alive” and tell a story…
Portraitsofguilford
The website has all the ingredients of vintage style. The vintage color palette makes use of few colors and nuances evoking old photos. It’s remarkable that the text itself has expressive fonts (they’re marked in white, on a darker background, for better legibility). As with any vintage color scheme, this one has some brown tones in it. And the brown nuances have some patina, which makes them more authentic and invites to an exploration of the past. Indeed, the website is about exploring the past through photo albums ranged by decades. Users can navigate back and forth on the timeline marked in white at the end of the screen, and retain the vintage look of each album.
Leathermilk
As you’ve probably seen in the previous examples, the vintage color palette includes tones of brown. This time, brown is darker, in combination with grey and white. It’s interesting that the CTA buttons fully integrate in the overall color scheme, with a light brown nuance. Also, icons in the menu are the same light brown color. Text is white, as well as the main CTA button background, bringing the message up and front. Also, the Hero background texture helps a lot in creating this retro style.
Baystreetbiergarten
The vintage color palette is original: a dark blue background, a transparent menu section and CTA button background, plus some very light brown (for the pixelated images). The contrast is expressive, in that it draws attention towards the website content. The impression some source lights the graphics in the website Hero contributes to the retro style, in an interesting way. Also, the text (title text, menu items text and CTA button text) is white, creating contrast with the background and increasing legibility.
This collection of vintage color palettes used in websites might inspire you in creating your own retro-style chromatic combination. Read about them, experiment with colors, choose wisely and test the results.
