designertom.io

description

notes

arrow_drop_down

Rise of a visual design trend: retro-minimalism

December 11, 2024 at 12:00 AM

Welcome back. If you've been following top design engineers lately, you've probably noticed a rising wave of what I'm calling "retro minimalism" - an intoxicating mashup of dithering, monospace typefaces, and brutalist design principles that's creating some dope visual styles.

Let's dive into why I think this is more than a trend and how you can start playing with it in your work.

—Tommy (@DesignerTom)

The Wireframe:

Why retro minimalism matters

Examples of retro minimalism

How to implement it in your work

The Rise of Retro Minimalism

video preview​

We all know how visual trends usually catch fire:

They look different enough to stand out

They're championed by people who do great work

They tap into something deeper than aesthetics

But what's happening with retro minimalism feels different. This isn't your typical Dribbble-bait gradient with rounded corners.

This is a love letter to the intersection of design and code, pushed forward by some of the heaviest hitters in product design right now (e.g. EvilRabbit at Vercel and Jordan Singer at Mainframe) - people who aren't just designing interfaces but building the tools that shape our industry.

When these folks start playing with dithering and monospace, others pay attention.

Why This Matters

Produced by Raycast​

This movement is a middle finger to the notion that designers and developers are separate species. It's about the makers who:

Live in both Figma and VS Code

Let their execution speak louder than their words

Understand that constraints breed creativity

The Building Blocks

Let's break down what makes retro minimalism work:

1. Monospaced Typography

​Personal Site by Evil Rabbit

Creates rhythm through rigid structure

Forces intentional hierarchy

Signals technical authenticity

2. High Contrast

video preview​

Improves readability

Creates dramatic visual impact

Simplifies decision-making

3. Dithered Renderings

video preview​

Adds texture without complexity

Creates depth through constraint

Callbacks to early pixel art and CRTs

Examples of Doing it Right

Here's who's doing it right:

​Unit Software is a masterclass in high-contrast brutalism

​Mainfra.me by Jordan Singer is a great storytelling example

​Sam Peitz receipt experiment​

​Tom Johnson demonstrates some incredible examples of product use cases in Basedash

Tina Mai's portfolio is brutalist principles done right

Another shoutout to Tom Johnson's dithered portraits​

​Personal Site by Paul Macgregor

Mono portfolios by Evil Rabbit and Jose Rago​

Together with Dovetail​

Unlock the Future of Customer Insights Now

Struggling to keep up with customer needs? The old ways—manual data analysis, repetitive research—are out. It’s time to upgrade your process.

Dovetail’s new Customer Insights Hub helps you:

Connect directly with real customer insights

Streamline research with a single source of truth

Leverage AI to uncover what matters, fast

Ready to build products that truly resonate with your customers? Start now.

The Tools of the Trade

Monospace Typography: The Foundation

Monospace typefaces, where each character occupies the same width, are deeply rooted in technical history.

Originally designed for typewriters and early computers, they create a distinct rhythm and immediate technical authenticity.

In interfaces, they work brilliantly for code blocks, technical information, and creating visual hierarchy through their rigid structure. They fall flat when overused in body copy or when you need to maximize space efficiency.

Some monospace typefaces you can use:

​Berkeley Mono by USGraphics

​T.26 Carbon by Anuthin Wongsunkakon

​OCR A by American Type Founders

​VCR OSD Mono by Riciery Leal

​Geist Mono by Vercel

Implementing Dithering & Retro Effects

Dithering, the art of using controlled noise to create the illusion of additional colors or shades, is having a moment. You can introduce these effects into your work through two main approaches:

Standard Design Tools:

Framer plugins like Depth Grid and Dither​

Figma plugins like Dither​

​Dither Brushes for Adobe Photoshop

​Asperite’s native gradient dither

​Unicorn.Studio's native Dither effects

Code Implementation:

​React and post processing effects​

​SVG Filters in Javascript

​WebGL shaders and effects

The Bottom Line

Retro minimalism is a callback to the nostalgia of 8-bit pixel games, CRT monitors, and an era when anyone creating digital work was at least an accidental pioneer of ideas.

As we head into 2025, expect to see more of this aesthetic, not because it's trendy, but because it represents something real: a return to intentional constraints and technical authenticity in an era when the barrier to shipping your own ideas is lower than ever.

"The computer can't tell you the emotional story. It can give you the exact mathematical design, but what's missing is the eyebrows." - Frank Zappa, 1979

See you next week,

Tommy

Thanks for reading! What's your favorite visual style? Hit reply and let me know.

Enjoying this newsletter? Let us know here.

If you enjoy the newsletter, it'd be amazing if you forwarded it to a friend! New people can join the fun here :)

You're receiving this email because you signed up for the UX Tools by DesignerTom mailing list or purchased one of our products. ​

To advertise with UX Tools, go here​.​

Hit reply if you have any questions!

​Unsubscribe | 113 Cherry St #92768, Seattle, WA 98104-2205


© 2025 tommy geoco

© 2025 tommy geoco