When we hear the term “retro design,” most of us think of styles from the 1920s to 1950s. That’s partly true, but if you dig deeper into creative trends, it becomes clear that retro elements are often combined with modern styles and directions. As a result, we see stunning website designs that look trendy and fresh on one hand, but on the other—evoke a nostalgic, historical vibe.
We’ve already covered in detail on our blog the topic of retro website design , including its features and examples. But today, we’re focusing on one of the key elements of any web design: the background and homepage styling that blends both retro and modern elements. That can’t be real ! – you might think, assuming such a combo can’t work. Well, let’s bust that myth and explore some new Photoshop techniques.
Classic Retro Features
The first thing users notice when visiting a site is the homepage design and the fonts used in headings, menus, logos, titles, and other key information. The background also plays a major role—whether it’s a photo, illustration, video, or a solid color.
In most cases, designers just use a handwritten-style font and claim it’s a retro site. But everything else remains untouched and modern. For example, lefarfallecharleston used a distinctly retro beige background (a color tied to time and nostalgia), fonts reminiscent of handwritten letters and printed publications from that era. If you examine the photos, you’ll notice they were processed—toned, darkened, and brightened—to give them an aged look.
Overall, though, the site’s design is flat and modern—using asymmetry and lots of white space. Minimalism and simplicity with a touch of artistic flair make this site a great example of combining modern and vintage.
Another standout project is fueled . If you only look at the homepage, it screams retro—bold slab-serif fonts, masterful photo editing with faded imagery, stripes and diamonds typical of the style. It seems like the designers deliberately ignored current trends.
But if you scroll further, moving through pages and sections, the vintage vibe fades away—only headings retain the retro look. All other pages feature standard illustrated graphic styles, bold gradients like ultraviolet, and strict modern fonts.
So the impression is clear: you see retro… but also modern design.
We also recommend checking out the designs of globalwelsh , meetthegreek , and agence-belle-epoque . Each of these websites, in one way or another, evokes a visual sense of past decades.
Sometimes, web designers take a bolder step. No, they don’t go 100% retro—but they apply the style so effectively that a single photo treatment replaces the need for typical decorative elements (like stripes, buttons, or dividers). You can see this approach on philz , biera , and forefathersgroup . These sites use dark toning and clever manipulation of contrast and color channels.
One way or another, if a web designer chooses to use retro style in a project, they need to understand that decorative elements alone aren’t enough—especially if only the homepage is given the vintage look. Sure, the right font can help set the tone, but it’s not enough by itself. Otherwise, you’ll end up with a cluttered design where nothing quite fits, and it feels off.
Retro Style Meets Modern Photoshop Trends
Today, let’s try to take an ordinary photo and not only give it a retro or faded look, but also add a few ultra-trendy graphic elements to make it really pop.
First, let’s acknowledge that there are plenty of Photoshop plugins, filters, and tools online for aging an image. But as we discussed in previous posts (like the one on black-and-white image styling ), professional designers rarely use them. Filters follow fixed algorithms, while each photo is different—different lighting, quality, exposure, etc. So results vary. One photo might look great, another might look awkward.
That’s why it’s easier to apply a couple of adjustment layers manually and get the desired vintage feel. Keep in mind: the aesthetic of the 1940s–50s differs greatly from the 1970s–80s—color tones and contrast vary.
Another key point: what makes a photo look aged? Faded colors, yellowing, crumpled paper texture, and folds that distort the image. That’s what we’ll recreate.
Start with a clean, unedited photo. For example, a small cityscape, train station, forest edge, or distant skyscrapers.
Open it in a new document and begin applying the vintage style. Create two copies of the background (keep the original layer off for safekeeping) and apply Filter → Other → High Pass . We want to emphasize fine detail on a gray base, so set the radius to around 1.4–2.2.
Set Layer 1’s blending mode to Linear Light . Compare it to the original—the photo now has sharper details and stronger contrasts. The difference is impressive.
Next, add a Curves adjustment layer from the bottom of the Layers panel to start color grading. Shape the Red curve into an S-curve to boost warm tones. Slightly tweak the Green curve to introduce a beige tint. Then gently shape the Blue curve into an S-curve to tint the shadows blue. If you recall 1970s–80s Soviet films, the effect will look familiar.
Clearly, such subtle and precise results are not achievable with generic filters.
On one hand, our retro image is ready—it can already be used as a standalone website design element. But let’s take it further and give it a more engaging, artistic look.
Add guides via View → New Guide and set the value to 50%—this will mark the center. Merge visible layers into a new one with Ctrl+Shift+Alt+E.
Use the Elliptical Marquee Tool to create a circle centered on the image (use the guides for precision).
Without deselecting, press Ctrl+J to copy the circle to a new layer. Use Free Transform to resize or move the circle slightly. The goal is to shift the focus so that the image inside the circle becomes clearly distinct.
Now let’s change the tone of the circle. Either apply a Curves adjustment layer with a clipping mask , or Ctrl+click the circle layer thumbnail to select it first, then add Curves—the mask will apply automatically. Adjust colors inside the circle—boost reds in the shadows, and make the edges more pronounced.
Create a new layer, use a soft round brush with red color and paint randomly on interesting spots. Set the blending mode to Screen and opacity to about 50–60% . This will simulate film light leaks. Feel free to use other colors too.
If your Curves layer (like “Curves 2”) has a mask, use it to erase parts of the circle’s edge with a foggy or smoke-textured brush (#35 in Photoshop’s special effects set). This gives it a worn, aged border.
Next, place a rough paper texture layer on top. Try different blending modes—Hue, Soft Light, Darken, Multiply —whichever fits your vibe best. The result looks more beautiful and more authentically vintage.
Now find the layer just before we started adding adjustments—the base contrast-enhanced one—and insert a new white layer set to Soft Light above it. Combined with our top layers, this gives a washed-out, sun-faded feel.
Add a noise texture above all other layers. Set its blending mode to Screen to remove black and adjust its size or rotation as needed.
You can also add a subtle blue overlay using a sampled color from the image. Create a new fill layer and set its blending mode to Pin Light . This adds a film-like blue tone, enhancing the vintage feel—use it only if it matches your vision.
Now let’s create “cracked” or “torn” pieces to add a modern, tech-inspired twist to the aged photo.
Use the Polygonal Lasso Tool to draw a rectangle or triangle across any upper layer. Press Ctrl+Shift+C to copy all visible content inside the selection, then Ctrl+V to paste it onto a new layer. Use the Move Tool to shift the piece—it creates a broken, glitchy look.
Create multiple such polygon fragments as separate layers and move them around. They don’t need to be sharp—subtlety is better here. You can temporarily disable the white overlay to see them better, then turn it back on later. When done, group the pieces into a folder called Polygons . Rotate and scale them as you like.
Add a text layer—site name, logo, slogan, or whatever fits your project. Choose a font that matches the design. Then add a mask to the text layer , use a soft smoky brush, and gently distress the letters. After all, text on an old photo shouldn’t be crystal clear.
You can duplicate the texture layers and apply them as clipping masks to the text , so they don’t affect the polygons.
And here’s the final result. Of course, you can “age” the photo less, skip some textures, or use a lighter approach. You can also convert the text into an image layer or turn off certain texture layers.
You could even add a glass shatter effect if you’d like.
Either way, the image now blends ultra-modern polygon cuts with a vintage photography style. Maybe it’s a bit too aged—but that’s the beauty of Photoshop. You can always tweak curves, levels, and blending modes to fit your exact vision.
Conclusion
Using retro and vintage elements in web design is just as relevant as strictly following modern and ever-changing trends . When creating a website, the goal is to not only deliver a cohesive design but also to make the homepage visually striking—enticing users to explore further. That’s why many sites start with a stunning visual intro—interactive elements, videos, or bold photos—followed by “boring” stuff like product cards, app descriptions, or floor plans.
To create a truly beautiful "cover," you need to go beyond basic design and think like an artist.
Combining retro and modern elements allows you to create mind-blowing compositions—part futuristic, part nostalgic. It gives the illusion that today’s tech was somehow invented a long time ago.
How far to push the aging, which techniques to use, and how to balance retro and modern—that depends on your project and creative vision. But one thing is certain: retro will never go out of style. And with long holidays ahead, there’s plenty of time for creative exploration.