Ir para o conteúdo
Frontend

O que é Tailwind CSS v4?

Definição

Tailwind CSS v4 é uma reescrita completa do framework utility-first, agora com engine em Rust (Lightning CSS) para builds até 10x mais rápidos. Elimina o arquivo tailwind.config.js em favor de configuração via CSS nativo com @theme.

A v4 usa cascade layers, container queries nativas e suporte a CSS moderno sem plugins extras. A detecção de classes é automática, sem necessidade de configurar content paths.

Exemplo Prático
TypeScript
@import "tailwindcss";

@theme {
  --color-brand: #7c3aed;
  --font-sans: 'Inter', sans-serif;
  --breakpoint-3xl: 1920px;
}

.btn {
  @apply bg-[--color-brand] text-white px-4 py-2 rounded-lg;
}

Quer ver Tailwind CSS v4 em ação em projetos reais?

Ver artigos sobre Tailwind CSS v4