Back to blog

How to quickly make horizontal, scrollable cards in Tailwind CSS

Posted in How To on July 6, 2022

A common design pattern that has been showing up are horizontal, scrollable cards. I want to show you how that's done.

This kind of design pattern is really useful as it allows us to keep the page snappy while still fitting in lots of good content. So instead of long scrolling pages because of lots of cards, we just make the cards scrollable horizontally. 

In this 6 minute video, I show you how you can make horizontal, scrollable cards easily without JavaScript and just a tiny bit of CSS using Tailwind CSS.

It's really that easy. I hope you benefit from this and if you ever need help creating super tight user interfaces, contact us at

Aaron Lopez

Aaron Lopez

Founder & Lead Developer at Wolf X Machina

Next Level Web Design and Development

Web design design, development, hybrid apps and more from Wolf X Machina.

Learn More