Tailwind CSS v4 Features and Migration Guide

Wed, 01 Apr 2026 12:00:00 +0900

Tailwind CSS v4.0 introduces a brand-new compilation engine written completely in Rust, accelerating build loops by up to 10x. Additionally, it transitions from a JavaScript-based configuration file (tailwind.config.js) to a CSS-first approach, where customizations are defined inside your primary stylesheet using standard CSS variables.

This article reviews the major changes in Tailwind CSS v4 and provides a practical migration walkthrough to help you upgrade your projects.

1. Key Changes in Tailwind CSS v4

1) Rust-Powered “Oxide” Engine

The defining feature of v4 is its compiler. Rewritten in Rust, the Oxide engine processes stylesheet files significantly faster than the old PostCSS-based engine. This translates to near-instantaneous dev server startups and hot module replacement (HMR), keeping developers in their flow.

Understanding CSS Subgrid Layout for Modern Design

Sun, 15 Mar 2026 12:00:00 +0900

CSS Grid revolutionized how web layouts are structured. However, a common challenge remained: aligning nested items (grandchild elements) inside parent Grid Items to the main grid lines.

This was resolved with the introduction of CSS Subgrid, a specification update for CSS Grid Layout. This article explains the fundamentals of CSS Subgrid and how to apply it to common layout problems like card lists.

1. What is CSS Subgrid?

Traditionally, only direct children of a Grid container can be positioned along the defined grid tracks. When you declare another grid inside a Grid Item, that nested grid is completely isolated from the outer parent grid.

Css on Kaisekukun

Tailwind CSS v4 Features and Migration Guide

1. Key Changes in Tailwind CSS v4

1) Rust-Powered “Oxide” Engine

Understanding CSS Subgrid Layout for Modern Design

1. What is CSS Subgrid?