Styling

Utility-first

• ★ Tailwind CSS v4 — the default for new React/Next.js apps. v4 is faster, has the new Oxide engine, CSS-first config, and great IDE tooling.
• UnoCSS — atomic CSS engine, very fast, very flexible presets. Popular in the Vue/Nuxt and Astro ecosystems.

CSS-in-JS that survived the era

• vanilla-extract — TypeScript CSS at build time, zero runtime, type-safe themes. Excellent fit with React Server Components.
• Panda CSS — type-safe CSS-in-JS-style API with build-time atomic CSS output. Pairs well with Park UI / Ark UI.
• StyleX — Meta's type-safe CSS-in-JS, atomic output, great for large apps where every byte matters.

Modern build-time CSS

• Lightning CSS — Rust-based CSS bundler/transformer (used inside Tailwind v4 and other tools).
• PostCSS — still ubiquitous as a base layer.

Mostly-deprecated (but you'll see them)

• styled-components — runtime CSS-in-JS; abandoned for new app router work due to RSC incompatibility, but maintenance continues.
• Emotion — same story; still works, less recommended for new RSC-heavy projects.

Component-style

• CSS Modules — built into Next.js, Vite, every framework. Boring and bulletproof.

Pick this if…

• Default new project: Tailwind v4.
• You want types + zero runtime + RSC-friendly: vanilla-extract or Panda CSS.
• Massive React app where bytes matter: StyleX.
• Multi-framework / Astro / Vue: UnoCSS.
• You truly hate utility classes: vanilla-extract or CSS Modules.