Not much official news this week, the Tailwind Labs team is hard at work on cool stuff. In the meantime, we got more Tailwind Connect photos 📸!
The State of CSS 2023 is open so be sure to do your part and fill it out!
Now onto our usual content 😉.
Adam released a bunch of pictures from Tailwind Connect, they're lovely! You can see them all here but there's a few:
On the community side, we got another awesome video from Sam Selikoff, where he showcases the powerful combination of Radix UI and Tailwind CSS. It's wild 🤯!
The sponsor of this issue is Windy – the browser extension that transforms any HTML element into a Tailwind CSS component with a single click. Save hours or days when you convert your non-Tailwind sites to Tailwind or go to any website and see how you can build any element with Tailwind CSS. Get a 20% discount if you use the code
TAILWIND-WEEKLY during the checkout.
shadcn/ui is a very opinionated React component library based on Radix UI and Tailwind that has been gaining some popularity in recent months. In this video, our friend Simon shows how to use it and why you might like it. I have been following Radix UI for a bit and shadcn/ui is exactly the type of project that can help with adoption.
This one is short and sweet! You'll learn how to make a beautiful shine hover effect using Tailwind and how easy is to adapt vanilla CSS to use it as Tailwind CSS instead!
A more general article but great nonetheless. This one is from Evil Martians, the folks behind autoprefixer and postcss. Just for that alone, the article deserves a glance and it didn't disappoint! I particularly liked point #8, will start implementing it on my forms going forward.
Sofa is one of those apps that makes you think "Huh, I didn't know I wanted that". It helps you "create lists of apps, books, board games, movies, tv shows, podcasts, music albums, and video games to enjoy later" and let me tell you, the landing page design is very nice. It has a kind of playful vibe with subtle colors and round font. Overall, a great landing page for a great app!
Here's another great icon source for you all! The Flowbite icons site is very similar to Heroicons as in you can copy the icon's code right away and the search is great. I do like that Flowbite has brand icons, albeit just a few. Looking forward to seeing it grow!
👌 Promoted links
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!
Become a Pro at building components & layouts with CSS Flexbox and Grid with the Complete Guide to CSS Flex and Grid ebook by Shruti Balasa. I actually read this book and LOVED IT. I have been using flexbox and CSS grid for years and I still learned quite a few things from the book.
OpenDyslexic is a new open-source font created to increase readability for readers with dyslexia. The typeface includes regular, bold, italic, and bold-italic styles. It is being updated continually and improved based on input from other dyslexic users.
Polypane is an excellent tool for testing your project’s responsive design and accessibility. The best thing about it is that it helps me catch visual bugs in seconds rather than hours. Definitely worth the money for the time I have saved.
Designing on your own and want fancy icons? Check out Iconfinder, they have the biggest and best selection of icons I have ever seen and at very affordable prices.
CSS Simplified by Shruti Balasa: One simple CSS tip every Wednesday from her decade of experience right into your inbox.
TypeScript Weekly: the best TypeScript links every week, right in your inbox.
This Week In React: the best of React & React-Native news. Sebastien filters the noise, and you save time!
Want to support the newsletter? You can buy me a coffee with the link below 😁.
Stay up to date with the Tailwind CSS firstname.lastname@example.org
Join other subscribers today.