Retro rewind: Web design inspiration from Smash Hits magazine

As a music-obsessed teen during the ’80s in the UK, my week revolved (at 33rpm) around Thursday’s Top of the Tops—the UK’s longest-running music TV program—and listening to the top 40 chart rundown on the radio every Sunday evening.

These pop charts mattered. Who was up? Who went down? Who climbed the charts to number one? And did someone go straight in? The charts were a crucial component of youth culture, and when we weren’t listening or watching, we were reading about our favorite artists in popular magazines like The Face and Smash Hits. Let’s see how web designers in 2025 can take inspiration from these iconic music magazines’ layouts and color palettes.

The Face was a groundbreaking British magazine that shaped fashion, music, and popular youth culture from 1980 to 2004. Under the early art direction of Neville Brody, The Face magazine became visually iconic as Brody pushed the boundaries of graphic design, layout, and typography.

Brody mixed distressed type, dynamic compositions, and creative photography. His often-experimental style has influenced countless designers in the decades since. Founded by editor and publisher Nick Logan, The Face magazine championed emerging talent, and early covers featured John Lydon, Paul Weller, and Siouxsie Sioux.

Also founded by Nick Logan, Smash Hits was a hugely popular music magazine published in the UK between 1978 and 2006, selling up to 166,000 copies per issue.

While The Face frequently showcased emerging artists, Smash Hits covered chart-topping mainstream artists like Blondie and The Jam in the late ’70s, Duran Duran, Kylie Minogue, and The Petshop Boys during the ’80s, and later Britney Spears, Madonna, and more.

In The Story of The Face, Logan wrote:

Smash Hits was well-known for its lighthearted interviews and song lyrics. It helped define mainstream pop journalism. Although its last regular issue was published in 2006, it has remained an icon of British pop history.

The early look of Smash Hits was defined by the technologies and tools available in the late ’70s. It used low-quality paper stock, black-and-white printing, and sometimes a single-color accent.

Original Smash Hits designer Steve Bush (credited as Ross George) worked hard to create a look that appealed to the magazine’s teen audience. Constraints often lead to better designs, and even today, something is appealing about the magazine’s single-accent-color page designs.

Bush used only one color per spread, which reduced the cost of printing and gave each spread a joined-up look. This single color was used for panel backgrounds and for tinting selected photographs. When flooded, it unified both pages in a spread.

But, when used sparingly, the accent attracted attention to the chosen content.

The layout of a Smash Hits spread was based on an eight-column grid. However, Bush often added energy to his layouts by overlapping elements so they escaped the confines of their columns. Images were cut out to allow someone’s eye to wander freely across the page, and frequently, even long passages of content were rotated to add a scattered look to the pages.

Despite its age, cheap production values, and unsophisticated appearance, there’s something charming, compelling even, about these designs for Smash Hits. I wanted to bring some of this appeal to my designs for The Daily Grind coffee company.

The brief: My client, The Daily Grind, is a coffee company that publishes an online magazine for cafés, coffee shops, and its customers. The client wants a bold, disruptive design that will appeal to its young audience. The Daily Grind isn’t an actual client, but the creative challenges and the decisions involved in designing a project like this are real.

When starting any new project, I ask my clients to define the character and personality of their audience. You might call that a “user persona.” I simply call it a portrait. A typical customer for The Daily Grind is independent-minded without being overly rebellious. They don’t consider themselves anti-establishment and value personal expression and identity. Unlike me, they’re not old enough to remember the 1980s.

At first glance, the spread of this Smash Hits collection of song lyrics might not look like it could be turned into the home page of The Daily Grind magazine. But something about the contrasting panel backgrounds and the implied hierarchy suggested they could be given a new purpose.

Pasting elements into black box wireframes allowed me to experiment with different layout combinations, rotations, and scales.

I frequently work in black and white, which allows me to focus on composition without being distracted by color choices. This seems especially appropriate when working on a design inspired by a predominantly black-and-white publication. I chose Bankside Sans, a contemporary sans-serif typeface from Dalton Maag for my typography. I used the regular weight for body copy and condensed bold for headlines. I paired this with a nostalgic Cooper Black for the main story’s headline.

Then, to echo the monochromatic look of Smash Hits, I tinted the entire design with a blue accent from The Daily Grind’s color palette.

Steve Bush frequently used panel colors to define content areas, which is obvious from this 1978 spread, in which an article about The Jam is reversed against a black background. The tightly packed columns of copy and rotated photographs suggest the experience of being at the live show depicted in the picture of Paul Weller.

I planned to use a similar background to emphasize the structure of this page design for an article about “the strongest cup of coffee ever.” I also wanted to use similarly rotated photographs to suggest the dizzying experience of drinking The Bolt Brew.

There’s an espresso intensity about the black and white design, which I enjoy.

Meanwhile, the accent-colored monochromatic look of Smash Hits softens the overall effect.

However, the black background makes its full impact with full-color photographs of the boiling beverage and its effect on its drinker.

Especially when I added design details like this Smash Hits-inspired magazine-style section header.

Desktop publishing and printing technologies developed rapidly during Smash Hits’ run, and ten years on, in 1988, the magazine was full color.

The magazine used vivid colors, full-color photographs, decorative elements, and an expanded typography palette. By the late 1980s, Smash Hits had developed a style that suited its now much younger audience.

Its designs included hand-drawn borders, illustrations, and an eclectic mix of type styles.

The designers kept the eight-column grid and the rotations but used color more liberally. Out went the single-color accents, and in came clashing, vivid colors.

The magazine’s audience may have loved this new look, but adding extra colors detracted from the iconic feel of their older designs.

The Daily Grind publishes its magazine weekly, giving its staff ample time to art-direct each new article individually. Still hankering after the iconic look of a single accent color, I was drawn to the clever use of pink in this spread, which contains an article about Elvis Costello.

I reused the eight-column grid and typography palette to connect this design to other The Daily Grind magazine pages. Then, I added a vibrant pink pattern of lightning bolts behind the befuddled beverage drinker.

On the contents page, too, the spreads looked very different in later versions of Smash Hits. Gone were its predominantly black-and-white pages and accents, replaced by a garish gallery of colors.

Page layouts were even more chaotic-looking, combined with the new colors and a mix of design elements. I was eager to explore how this later style might be translated into an alternative design for The Daily Grind magazine, which could be used for category or tag pages. My wireframe uses a modular grid, with article elements flowing horizontally and vertically across the page.

I added hand-drawn boxes and other backgrounds.

Then, I experimented with shades (darker) and tints (lighter) of an accent color. These, along with monochrome images, give this design its retro feel.

However, the best and final result came from combining the shaded and tinted accent color with full-color photographs, which pays homage to the design’s origins but feels contemporary.

The design evolution of Smash Hits—from its bold monochrome beginnings to its riot of colors in later years—demonstrates how visual identity can shape and reflect its audience. Drawing inspiration from its early layouts, restrained color palettes, and dynamic compositions, I’ve crafted a design for The Daily Grind that blends nostalgic charm with modern appeal.

Great design isn’t just about aesthetics; it’s about capturing an attitude. Whether in print or on the web, the lessons from Smash Hits prove that even the most straightforward constraints can spark creativity, and a distinctive visual style can leave a lasting impression.

As web designers, we can enrich our designs by looking for inspiration from diverse sources. The aesthetic of Smash Hits magazine is a long way from most contemporary web design, but as we’ve seen today, it still holds plenty of valuable lessons for web designers.

If you’d like to see how other cultural influences can impact your design decisions, check out what movie poster design can teach web designers and how fanzines can be similarly inspiring!

Often referred to as one of the pioneers of web design, Andy Clarke has been instrumental in pushing the boundaries of web design and is known for his creative and visually stunning designs. His work has inspired countless designers to explore the full potential of product and website design.

Andy has written several industry-leading books, including Transcending CSS, Hardboiled Web Design, and Art Direction for the Web. He’s also worked with businesses of all sizes and industries to achieve their goals through design.

Visit Andy’s studio, Stuff & Nonsense, and  check out his Contract Killer, the popular web design contract template trusted by thousands of web designers and developers.