SIMPLE Way To Make Responsive Design Easier in TailwindCSS

I’m a novice and this has been really helpful:

(Temporarily) change the background color at each responsive breakpoint (link to official responsive design docs). For example:

<div class=”bg-red-200 sm:bg-yellow-200 md:bg-blue-200 lg:bg-green-200 xl:bg-purple-200 2xl:bg-pink-200 pt-4"><!-- put your code for the entire page here --></div>

…but I’m sure you get the idea that as I make the browser window wider and wider, the background changes color, to help me recognize how things look at different browser window sizes:

Best of luck!



Between 3 and 9 feet tall

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store