- Tailwind Weekly
- Posts
- Tailwind Weekly #180: v4 Stable Launch Next Week, Tailwind Connect in Miami, and 12 Great CSS One-Liners 🤩
Tailwind Weekly #180: v4 Stable Launch Next Week, Tailwind Connect in Miami, and 12 Great CSS One-Liners 🤩
Hello folks!
I wish you all a happy new year and may this year be filled with exciting opportunities, creative projects, and loads of learning for you all.
To start off the year, Adam asked Twitter/X why people liked using Tailwind on their projects. The responses were overwhelmingly positive and I encourage you to read the comments, they were very insightful.
Now, let's dive in!
🌟 News
It’s official, V4 stable will be out next week! It’s highly likely it’ll be announced during the event on Tuesday w, but in the meantime, if you want to play with the beta, then here are the docs!
And speaking of Tuesday, the Tailwind team announced the next Tailwind Connect event, which will be held next Tuesday in Miami, Florida. I’ll be attending and reporting back next week, so stay tuned 😄.
🤩 Sponsor
Getting requests from businesses who need a website? But your schedule's maxed out ⁉️
As active members of the Tailwind dev community ourselves, FLX Websites creates and supports professional, modern websites that will make both you and your referral look great.
Plus, we'll send you a $200 USD bonus if your referral becomes a client. 💸
📚 Learning
This video is a fantastic intro to the Popover API! It shows you how to create interactive popovers using just HTML attributes and a splash of CSS, no JavaScript required. The tutorial walks you through the basics like toggling popovers, adding dismiss functionality, and even styling them with pseudo-selectors and pseudo-elements like ::backdrop. It also dives into some cool tricks for positioning popovers and explores browser compatibility, especially with features like anchoring.
You know how we usually just use console.log() for text and variables? Well, it turns out you can actually render CSS, SVGs, and even HTML in the console, too. This technique can add a whole new level of interaction and surprise for curious users. You can use CSS to style console messages, swap text in SVGs with JavaScript, and even create animations. The article even dives into some fun examples, like a running horse animation, and discusses browser compatibility quirks.
This piece walks you through learning how to replace outdated hacks with modern solutions like aspect ratio for media, object-fit for images, and logical properties like margin-inline. Plus, it covers progressive enhancements like text-wrap and scrollbar-gutter that offer slick upgrades without breaking in unsupported browsers. It's all about those easy wins and reducing the need for JavaScript—definitely worth a read if you're into optimizing your code.
💅 Showcase
Kamikani is a unique tool designed for web developers who want to learn Japanese in a fun and engaging way. Instead of relying on traditional memorization techniques or flashcards, it incorporates an interactive gaming experience. The mechanics are designed to make studying feel enjoyable, encouraging consistent learning without it feeling like a chore. Players can track their progress on leaderboards while naturally building their Japanese language skills in an intuitive and immersive way.
🎁 Resource
This is a collection of ready-to-use snippets that combine the power of Vue with the styling magic of Tailwind CSS. You can copy and paste animation snippets for appear animations, between transitions, and even list add/remove animations. This is perfect for developers who want to save time while ensuring their apps look polished and professional.
👌 Cool Stuff
Windy is a browser extension for Google Chrome and Firefox that lets you transform HTML elements to Tailwind CSS with a single click. Speed up your workflow with Windy and save hours or even days when converting existing styles to Tailwind CSS.
The Writer's Job Newsletter – Weekly curated writing jobs that pay well, helping freelancers land gigs without the hassle.
Justin Jackson's Newsletter – SaaS growth tips, bootstrapping lessons, and honest business insights, sent every Saturday morning.
The Webman Diaries – Insights on web development, caching, edge computing, serverless, and front-end ecosystems, shared weekly.
Do you want to share something with the Tailwind CSS 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 😁.
