DEV Community

Cover image for Tailwind v4.0
Devyn Clark
Devyn Clark

Posted on

2 1

Tailwind v4.0

Tailwind v4.0 is finally here!

This new version of the popular CSS framework has been reconfigured for greater efficiency and is taking the new web platform by the horns to lighten the load on all of web-dev!

Boosted Performance engine
Full builds have now increased to five times the speed. If that isn't enough, the speed of an incremental build has boosted by 100 times.

Simplified Installation
The amount of dependencies has lessened as well as zero configuration.

Automatic content detection

Adding onto the lack of configuration needed, your template files may now be detected automatically.

An instance of this would be avoiding scan your project's '.gitignore' file or any binary extensions like images or videos.

CSS-first configuration

In a major shift, you may now use your CSS file to directly configure your customizations when you've imported tailwind.

CSS theme variables
Tailwind v4.0 allows you to take your design tokens and make them available as variables by default, allowing you to reference them during the runtime.

This will make using them as inline styles or passing them to libraries like Motion easier.

Additional 3-D transformation ultlities

New API's have been added to bump up 3-D transformations: 'rotate-x-', 'rotate-y-', 'scale-z-', 'translation-z-' as well as others.

Look to the updated transform-style, rotate, perspective, and perspective-origin documentation to get started.

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

Top comments (1)

Collapse
 
ratneshat24 profile image
Ratnesh Sharma

Thanks for sharing this update! Tailwind v4.0 looks like a game-changer with its performance boost and CSS-first configuration. The automatic content detection and 3D transformation utilities are great additions. Excited to explore these new features!

Postmark Image

Speedy emails, satisfied customers

Are delayed transactional emails costing you user satisfaction? Postmark delivers your emails almost instantly, keeping your customers happy and connected.

Sign up