# Tailwind CSS Blog All the latest Tailwind CSS news, straight from the team. This is one page of public article previews, not the complete archive. Follow Next page to continue. Summaries are not the original full articles. ## Tailwind Labs is joining Shopify DevFeed: [Tailwind Labs is joining Shopify]() Original publisher: [Read original article]() Published: 2026-09-09T13:15:00Z Content type: news Language: en Sources: [Tailwind CSS Blog]() Topics: [Web Development](), [modern web development]() Tags: [css](), [framework](), [open-source](), [shopify](), [tailwind](), [user-interfaces]() ### AI overview Tailwind Labs is joining Shopify, which will provide a long-term home for maintaining Tailwind CSS. The team says Tailwind and its other open-source projects will remain MIT-licensed and community-led. ### Source excerpt We're joining Shopify to give Tailwind a stable long-term home where it will be actively maintained for the millions of people who depend on it. ## Tailwind CSS v4.3: Scrollbars, new colors, and more DevFeed: [Tailwind CSS v4.3: Scrollbars, new colors, and more]() Original publisher: [Read original article]() Published: 2026-05-08T20:00:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [modern web development](), [Webpack](), [Next.js](), [Netflix](), [Vercel]() Tags: [css](), [netflix](), [next-js](), [releases](), [tailwind](), [vercel]() ### AI overview Tailwind CSS v4.3 introduces first-party scrollbar styling, size-container utilities, direct utilities for additional CSS properties, tab-size controls, stacked and compound variants in CSS, and default values for functional utilities. The article also covers v4.2 additions, including new color palettes, a webpack plugin, logical property utilities, and OpenType feature controls. ### Source excerpt Tailwind CSS v4.3 is here with first-party scrollbar styling, even more logical property utilities, new zoom and tab-size utilities, better @variant support, and all the v4.2 stuff we shipped while forgetting blogs existed. ## Vanilla JavaScript support for Tailwind Plus DevFeed: [Vanilla JavaScript support for Tailwind Plus]() Original publisher: [Read original article]() Published: 2025-07-25T14:30:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [Vanilla JavaScript](), [ui](), [JavaScript](), [HTML](), [aria](), [dialog](), [cross-platform](), [Web platform]() Tags: [aria](), [component](), [cross-platform](), [dialog](), [framework](), [html](), [javascript](), [tailwind](), [ui]() ### AI overview Tailwind Plus now provides fully functional, accessible, and interactive UI blocks for projects that do not use React or Vue. Its new Elements library offers headless custom elements for building interactive interfaces with HTML, utility classes, or custom CSS. ### Source excerpt Every UI block in Tailwind Plus is now fully functional, accessible, and interactive, even if you don't use a framework like React or Vue. ## Compass: A starter kit for online courses DevFeed: [Compass: A starter kit for online courses]() Original publisher: [Read original article]() Published: 2025-05-14T19:00:00Z Content type: article Language: en Sources: [Tailwind CSS Blog]() Topics: [modern web development](), [Web Development](), [interactive website]() Tags: [apis](), [browsers](), [css](), [javascript](), [next-js](), [picture-in-picture](), [tailwind](), [transcripts](), [ui](), [video]() ### AI overview Compass is a Tailwind CSS and Next.js starter kit for publishing online courses. The article describes its video interface, including an IntersectionObserver-based alternative to passive Picture-in-Picture behavior, and discusses authoring interview transcripts. ### Source excerpt I've been itching to get back into screencasting and teaching lately, and the natural first step was to build our own course platform. So we just released Compass, a Next.js starter kit for publishing your own online course. ## Tailwind CSS v4.1: Text shadows, masks, and tons more DevFeed: [Tailwind CSS v4.1: Text shadows, masks, and tons more]() Original publisher: [Read original article]() Published: 2025-04-03T20:00:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [Web Development](), [Release notes](), [browser]() Tags: [browser](), [build](), [developer-experience](), [npm](), [release-notes](), [tailwind-css]() ### AI overview Tailwind CSS v4.1 introduces text shadow utilities, masking utilities, new variants, improved older-browser compatibility, finer text wrapping controls, input-device targeting, alignment utilities, and build configuration options. The release also includes additional text-shadow customization features and is available through npm. ### Source excerpt I wasn't sure it would ever happen but we did it -- we released a version of Tailwind CSS that includes text shadow utilities. Tailwind CSS v4.1 is here and it's packed with improvements that will help you (or your LLM, you coward) build even better interactive experiences. ## Tailwind UI is now Tailwind Plus DevFeed: [Tailwind UI is now Tailwind Plus]() Original publisher: [Read original article]() Published: 2025-03-04T16:00:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [ui](), [front-end-development](), [Documentation]() Tags: [components](), [content](), [documentation](), [events](), [front-end-development](), [project](), [resources](), [tailwind](), [ui](), [update]() ### AI overview Tailwind UI has been rebranded as Tailwind Plus without changing its one-time pricing, lifetime access, existing content, or upgrade terms. The announcement describes possible future additions such as saved Tailwind Play experiments, editor themes, color palettes, typography themes, a private community, beta documentation access, and early event registration, alongside continued investment in components, templates, and Catalyst. ### Source excerpt We just shipped a huge rebrand project, turning what was previously known as Tailwind UI into Tailwind Plus. Tailwind Plus is the all same high-quality resources you know from Tailwind UI, but with all-new possibilities and potential. ## Tailwind CSS v4.0 DevFeed: [Tailwind CSS v4.0]() Original publisher: [Read original article]() Published: 2025-01-22T22:00:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [Framework](), [CSS](), [Web platform](), [Vite](), [upgrade]() Tags: [configuration](), [framework](), [performance](), [tailwind](), [tailwind-css](), [tooling](), [upgrade](), [vite](), [web-platform]() ### AI overview Tailwind CSS v4.0 is a major release focused on performance, flexibility, and a CSS-first configuration experience. It introduces a faster build engine, simplified installation, a first-party Vite plugin, automatic content detection, native CSS theme variables, container queries, new 3D transform utilities, expanded gradients, and other modern CSS features. ### Source excerpt We just released Tailwind CSS v4.0 -- an all-new version of the framework optimized for performance and flexibility, with a reimagined configuration and customization experience, and taking full advantage of the latest advancements the web platform has to offer. ## Tailwind CSS v4.0 Beta 1 DevFeed: [Tailwind CSS v4.0 Beta 1]() Original publisher: [Read original article]() Published: 2024-11-21T18:30:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [CSS](), [build performance](), [modern web development](), [Tooling]() Tags: [compatibility](), [developer-experience](), [framework](), [performance](), [release](), [tailwind](), [tailwind-css](), [tooling]() ### AI overview Tailwind CSS v4.0 Beta 1 is the first public beta release after an extended alpha period. The new engine is designed for performance and the modern web, with faster full and incremental builds, a unified toolchain, CSS-first configuration, and support for modern CSS features. ### Source excerpt After a long alpha period, we're excited to release the first public beta of Tailwind CSS v4.0. ## Radiant: A beautiful new marketing site template DevFeed: [Radiant: A beautiful new marketing site template]() Original publisher: [Read original article]() Published: 2024-09-12T10:30:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Web Development]() Tags: [animation](), [blog](), [css](), [next-js](), [saas](), [tailwind](), [ui]() ### AI overview Tailwind UI releases Radiant, a SaaS marketing-site template built with Next.js, Framer Motion, and Tailwind CSS. The article explains its interaction-focused animation approach, including Framer Motion variant propagation and a CSS-based logo timeline. ### Source excerpt Over the past couple of months we've been working away at a new SaaS template called Radiant and it's out now as part of Tailwind UI. ## Headless UI v2.1: Simplified transition API and improved multi-dialog support DevFeed: [Headless UI v2.1: Simplified transition API and improved multi-dialog support]() Original publisher: [Read original article]() Published: 2024-06-21T15:00:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [React](), [dialog](), [React UI animations]() Tags: [compatibility](), [components](), [dialog](), [documentation](), [install](), [react]() ### AI overview Headless UI v2.1 for React simplifies transition APIs with a new prop and data attributes for transition stages. It also supports rendering multiple sibling dialogs, with the most recently opened dialog closing on Escape or outside clicks. ### Source excerpt We just released Headless UI v2.1 for React, which dramatically simplifies our transition APIs and adds support for rendering multiple dialogs as siblings. We've made transitions way easier in v2.1 by adding a new prop to all of the built-in components you might want to transition, and adding data attributes for each transition stage so you can add transition styles by just throwing some classes on the target element: There are four data attributes you can use to target the different stages of... ## Automatically clean up whitespace and duplicate class names DevFeed: [Automatically clean up whitespace and duplicate class names]() Original publisher: [Read original article]() Published: 2024-05-31T16:30:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Prettier](), [Sorting](), [VS Code Extension]() Tags: [extension](), [github](), [plugin](), [sorting](), [vs-code]() ### AI overview A new version of prettier-plugin-tailwindcss automatically removes unnecessary whitespace and duplicate class names while sorting. The release also notes that the VS Code extension has long warned about duplicate classes, and invites users to report issues on GitHub. ### Source excerpt We just released a new version of prettier-plugin-tailwindcss which adds support for removing unnecessary whitespace and duplicate classes when sorting. ## Catalyst: Application layouts, navigation menus, description lists, and more DevFeed: [Catalyst: Application layouts, navigation menus, description lists, and more]() Original publisher: [Read original article]() Published: 2024-05-24T20:00:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Web Development](), [Dark Mode]() Tags: [api](), [dark-mode](), [react](), [ui](), [update]() ### AI overview Catalyst's first major update adds application layouts, navigation components, and description lists, and marks Catalyst as stable for production use with Headless UI v2.0 for React. ### Source excerpt We just published the first major update to Catalyst since releasing the development preview, with two new application layouts, navbar and sidebar components, description lists, and more. ## Headless UI v2.0 for React DevFeed: [Headless UI v2.0 for React]() Original publisher: [Read original article]() Published: 2024-05-07T16:00:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Web Development](), [modern web development](), [SDKs]() Tags: [api](), [css](), [developer-experience](), [html](), [react](), [ui]() ### AI overview Headless UI v2.0 for React adds built-in anchor positioning, a headless checkbox component, and form-control components that automate IDs and attributes. ### Source excerpt We just released Headless UI v2.0 for React which includes a ton of new stuff including built-in anchor positioning, a new headless checkbox component, HTML form components and more! ## We're hiring a Design Engineer + Staff Engineer DevFeed: [We're hiring a Design Engineer + Staff Engineer]() Original publisher: [Read original article]() Published: 2024-03-19T18:00:00Z Content type: article Language: en Sources: [Tailwind CSS Blog]() Topics: [Web Development](), [modern web development](), [Dark Mode]() Tags: [apis](), [css](), [dark-mode](), [design](), [documentation](), [react](), [tailwind](), [ui](), [work]() ### AI overview Tailwind CSS is hiring a Design Engineer and a Staff Software Engineer for new projects. The Design Engineer role covers interface design, Tailwind CSS prototypes, UI components, documentation demos, and related web projects. ### Source excerpt We just tagged the first public v4.0.0-alpha so you can start experimenting with it and help us get to a stable release later this year. ## Open-sourcing our progress on Tailwind CSS v4.0 DevFeed: [Open-sourcing our progress on Tailwind CSS v4.0]() Original publisher: [Read original article]() Published: 2024-03-06T16:30:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [CSS](), [Rust](), [TypeScript](), [Parsing](), [PostCSS](), [Web platform]() Tags: [build](), [compatibility](), [css](), [developer-experience](), [experimental](), [features](), [framework](), [open](), [parsing](), [performance](), [pipeline](), [plugins](), [release](), [rewrite](), [rust](), [syntax](), [tailwind](), [typescript](), [web-platform]() ### AI overview Tailwind CSS announces the first public v4.0.0-alpha of its rewritten Oxide engine. The release focuses on faster builds, a smaller installed footprint, Rust-based performance improvements while retaining a TypeScript core, a custom parser, and integrated CSS processing through Lightning CSS. ### Source excerpt We just tagged the first public v4.0.0-alpha so you can start experimenting with it and help us get to a stable release later this year. ## Introducing Catalyst: A modern UI kit for React DevFeed: [Introducing Catalyst: A modern UI kit for React]() Original publisher: [Read original article]() Published: 2023-12-20T20:00:00Z Content type: article Language: en Sources: [Tailwind CSS Blog]() Topics: [React](), [App](), [Tailwind CSS]() Tags: [component](), [components](), [design](), [development](), [documentation](), [react](), [tailwind](), [ui]() ### AI overview Tailwind introduces Catalyst, a development preview of a fully componentized, batteries-included UI kit for React. It provides source-based components with composable APIs that developers copy into their projects and customize as the foundation of their own component systems. ### Source excerpt We just released the first development preview of Catalyst, our new fully-componentized, batteries-included application UI kit for React. ## Tailwind CSS v3.4: Dynamic viewport units, :has() support, balanced headlines, subgrid, and more DevFeed: [Tailwind CSS v3.4: Dynamic viewport units, :has() support, balanced headlines, subgrid, and more]() Original publisher: [Read original article]() Published: 2023-12-19T17:45:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [CSS](), [modern web development](), [Web Development](), [browser]() Tags: [browser-ui](), [browsers](), [css](), [features](), [npm](), [release](), [release-notes](), [tailwind]() ### AI overview Tailwind CSS v3.4 introduces dynamic viewport units, parent and child variants, new sizing utilities, balanced headline utilities, subgrid support, expanded sizing and opacity scales, and forced-colors utilities. The release also supports newer viewport units for mobile layouts and includes browser-based experimentation through Tailwind Play. ### Source excerpt There's nothing like building a major new product for finding all the features you wish you had in your own tools, so we capitalized on that inspiration and turned it into this -- Tailwind CSS v3.4. ## Heroicons Micro: What are these, icons for ants? DevFeed: [Heroicons Micro: What are these, icons for ants?]() Original publisher: [Read original article]() Published: 2023-12-18T16:30:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Micro](), [Figma](), [React](), [Vue.js]() Tags: [applications](), [design](), [figma](), [libraries](), [react](), [ui](), [vue]() ### AI overview Heroicons v2.1 introduces a micro style with nearly 300 16x16 icons designed for dense, high-density user interfaces. The icons were redrawn from scratch to remain crisp at their intended size and are available through the Heroicons website, an official Figma library, and React and Vue libraries. ### Source excerpt We just released Heroicons v2.1 which includes a brand new micro style -- a full set of almost three hundred 16x16 icons designed for tighter, higher density UIs. ## Meet Studio: Our beautiful new agency site template DevFeed: [Meet Studio: Our beautiful new agency site template]() Original publisher: [Read original article]() Published: 2023-08-07T10:30:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Web Development]() Tags: [animation](), [api](), [browser](), [next-js](), [tailwind](), [ui]() ### AI overview Tailwind UI introduces Studio, an agency website template built with Next.js, MDX, and Tailwind CSS. The article highlights its educational focus and its animated, interactive design details, including a component-based API for scroll-triggered entrance animations. ### Source excerpt We just released Studio -- a beautiful new agency website template we've been working on for the last couple of months for Tailwind UI. ## Tailwind Connect 2023: Recap of our first in-person event DevFeed: [Tailwind Connect 2023: Recap of our first in-person event]() Original publisher: [Read original article]() Published: 2023-07-19T17:00:00Z Content type: news Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [CSS](), [Web Development]() Tags: [community](), [conference](), [css](), [developers](), [event](), [keynote](), [recap](), [tailwind]() ### AI overview A recap of Tailwind Connect 2023, an in-person event in Cambridge, Ontario attended by more than 200 people. The article describes the meetup-style event, its community activities, a keynote on the history of Tailwind CSS, and demonstrations of new CSS features. ### Source excerpt Last month, over 200 people got together in my hometown of Cambridge, Ontario to hang out, talk shop, and get a peek behind the curtain at some of the new stuff we've been working on. ## New changelog template + the biggest Tailwind UI update ever DevFeed: [New changelog template + the biggest Tailwind UI update ever]() Original publisher: [Read original article]() Published: 2023-04-24T14:00:00Z Content type: article Language: en Sources: [Tailwind CSS Blog]() Topics: [changelog](), [Tailwind CSS](), [Next.js](), [MDX](), [Syntax Highlighting](), [Dark Mode](), [Web Development]() Tags: [changelog](), [code](), [css](), [dark-mode](), [learn](), [next-js](), [tailwind]() ### AI overview The article introduces Commit, a Tailwind UI changelog template built with Tailwind CSS and Next.js. It presents the template as a single-page project homepage and changelog feed, with dark mode, custom typography, Shiki-powered syntax highlighting, MDX-based single-file editing, CSS-variable customization, and Motion One animations. ### Source excerpt Over the last four months we've probably done more work on Tailwind UI than we ever have, and having finally wrapped up what we set out to achieve I'm excited to lay it all out for you. ## Tailwind CSS v3.3: Extended color palette, ESM/TS support, logical properties, and more DevFeed: [Tailwind CSS v3.3: Extended color palette, ESM/TS support, logical properties, and more]() Original publisher: [Read original article]() Published: 2023-03-28T14:30:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Tailwind CSS](), [CSS](), [TypeScript](), [releases](), [npm](), [browser]() Tags: [css](), [npm](), [release](), [release-notes](), [tailwind](), [typescript]() ### AI overview Tailwind CSS v3.3 introduces darker 950 color shades, ESM and TypeScript configuration support, logical properties for simplified RTL layouts, adjustable gradient color stops, built-in line clamping, a combined font-size and line-height modifier, shorter CSS variable syntax, and several new utilities. The release also provides upgrade instructions through npm and access to the features in Tailwind Play. ### Source excerpt Tailwind CSS v3.3 is here -- bringing a bunch of new features people have been asking for forever, and a bunch of new stuff you didn't even know you wanted. ## Protocol: A beautiful starting point for your next API documentation site DevFeed: [Protocol: A beautiful starting point for your next API documentation site]() Original publisher: [Read original article]() Published: 2022-12-15T15:00:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [Template](), [API](), [Documentation](), [MDX](), [Next.js](), [Tailwind CSS](), [React](), [Framer Motion](), [Library]() Tags: [api](), [api-documentation](), [building](), [code](), [components](), [documentation](), [js](), [markdown](), [mdx](), [next-js](), [react](), [tailwind-css]() ### AI overview Tailwind CSS introduces Protocol, a website template for building API reference documentation sites with Next.js and MDX. The article highlights its polished navigation and interaction design, authoring workflow, reusable components, and the mdx-annotations library for passing data through MDX tags. ### Source excerpt It's been months in the making but I'm excited to finally release our next website template -- Protocol, a beautiful starter kit for building amazing API reference websites. ## Tailwind CSS v3.2: Dynamic breakpoints, multi-config, and container queries, oh my! DevFeed: [Tailwind CSS v3.2: Dynamic breakpoints, multi-config, and container queries, oh my!]() Original publisher: [Read original article]() Published: 2022-10-19T15:30:00Z Content type: release Language: en Sources: [Tailwind CSS Blog]() Topics: [modern web development](), [releases](), [Web Development]() Tags: [aria](), [css](), [data](), [release](), [tailwind]() ### AI overview Tailwind CSS v3.2 introduces dynamic breakpoints, multiple configuration files, container queries, nested groups, and new conditional styling variants for browser support, ARIA attributes, and data attributes. ### Source excerpt ...and nested group support, `aria-*` variants, `data-*` variants, `@supports` support, and more. [Next page]()