Learn Tailwind CSS with Tailwind Play!

No doubt you've heard great things about Tailwind CSS. Maybe you've told yourself that you want to try it out, but after looking at installation instructions, you've put it on the back burner.

With the introduction of Tailwind Play, testing Tailwind CSS has never been easier!

Check out Tailwind Play here!

Tailwind Play is Tailwind's new online playground! It comes with a snappy IDE window and gives you full access to Tailwind's feature set - allowing you to even customize the tailwind.config.js file!

Even if you aren't using Tailwind for production products, it has always been a great solution for quick prototyping and with the introduction of Tailwind Play, it's never been easier to get started!

Screen Shot 2020-10-13 at 11.55.40 AM.png

Benefits of Tailwind Play

  • Full access to Tailwind features as if you had installed it in your own project
  • Snappy IDE
  • Hot-reload preview window
  • Light and dark mode
  • Autocomplete utility class-names
  • Show off your work with the Share feature (generates unique link)

If you haven't already, be sure to check out Tailwind Play and let me know what you think in the comments below!

Thanks for reading! If you liked this article and want more content like this, read some of my other articles , subscribe to my newsletter and make sure to follow me on Twitter!

Interested in reading more such articles from Braydon Coyer?

Support the author by donating an amount of your choice.

Recent sponsors
Ahmed Altaai's photo

Thank you for sharing!

Emily Boston's photo

Tailwind Play is amazing. 🙌

Syed Fazle Rahman's photo

Checked Tailwind Play a few days ago on PH. It's an amazing tool to quickly play around and built components without setting up Tailwind.

Thank you for writing about it here.

Cornelius Müller's photo

Hi Braydon ;),

very nice Playground. I already thought about implementing my own.

I dont know how much effort you want to put into this project but I have a small Idea to make it even more awesome.

My Idea is a export button for the used styles. Maybe with the option to include normalize.css or not.

Often i design a very small static website and I load Tailwind via the CDN Link. Because I dont want to setup a whole build process just for purging the css.

With this export button it would be possible to copy the html inside your editor and export all classes which are used in the project. And then you would only need to include those exported styles and drop the CDN Link.

Maybe this would be a nice feature ;).

Thank you for thinking about it. If you want I can help you with this feature.