Stay up to date with the Tailwind CSS ecosystem

vivian@example.com

Join other subscribers today.

Tailwind Weekly #42: New Tailwind UI Figma kit + new youtube video series!

Hello folks!

This sure was an interesting week, the Tailwind Labs was practically on fire launching stuff 🚀. We also got so mainstream we now have a new TailwindCSS compiler, check out the resource section for more details.

P.S. We had a bit of a makeover starting from this issue, I hope you guys like it!

Note: Some of these links are affiliate links, which means I get compensated in some way if you buy through them but I promise I only recommend products I really like!

🌟 News

We had a week packed with tailwind news! Let’s start with the beginning, we got:

  • The official Figma kit for Tailwind UI, designers rejoice!
  • A brand-new youtube course called “From Zero to Production”, I watched it and loved it, it’s a great introduction to the framework and the utility-first way. Check the first video here.
  • Remember last week when Steve was giving us a sneak peek of an upcoming landing page? It’s here. Now you can get notified when Tailwind UI gets support for React and Vue 👌.

🤩 Sponsor

Polypane is a great tool for testing your project’s responsive design and accessibility. I use this daily for my frontend work and its 👌. If you sign up using this link you’ll get 20% off your subscription applied at checkout.

📚 Learning

How to use TailwindCSS in a Cookiecutter Django project

I have a confession to make, I don’t do much python these days but I have a soft spot for cookie-cutter django, my first ever open source contribution was to this project back in a djangocon years ago, oh how the time flies!

But enough sentimentality, this tutorial is good! I really like that they switch from gulp to Webpack (more modern) and handhold you the entire time, I know that some python devs frown at JS but if even if you do, the article has very clear steps, and its even funny at times, definitely a good read.

💅 Showcase

Blitz.js - The Fullstack React Framework

This week I bring a new dev-focused site again, this time it’s a very fancy one. Blitz.js website has come a long way ever since it launched. Now it’s colorful and very playful, those hand lines look really cool plus they manage the content-heavy section very nicely.

For the curious, Blitz is:

a hyper-productive fullstack React framework that’s built on Next.js and features a “Zero-API” data layer.

🎁 Resource

Windi CSS

Windi CSS is “a next-generation Tailwind CSS compiler”, yep, we’re now so mainstream we got a compiler. If you thought twin.macro was fancy Windi CSS has nothing to envy it, check out the features page and you’ll see. I particularly love the + and - for the screen size utilities, very clever!

🗞 Classifieds

Note: Some of these links are affiliate links, which means I get compensated in some way if you buy through them but I promise I only recommend products I really like!

At Tailwind Made, we recently launched our latest template, Atlas! Atlas is perfect for that personal blog you always wanted to start. It has a dark mode, a configured typography plugin, and it’s fully responsive. We also have a legal/business and an e-commerce template if you’re interested.

Imagine if you could go to any website, find a section/element you like, and get the approximate tailwind values to code it yourself. Like that idea? Then Windy is for you, the tool is still in its early stages but it looks very promising.

Need to build a quick marketing page for your next project? Then try out Tails! Tails is the ultimate drag'n drop page builder built for TailwindCSS, they have a great selection of components (over 120+), let you export your code, and have very affordable pricing.

Want to share something with the TailwindCSS community? You can submit a link or message me on Twitter @vivgui.

Want to support the newsletter? You can buy me a coffee with the link below 😁.