Tailwind CSS v4는 PostCSS와 CSS-first 설정으로 연결한다

JavaScript 설정 파일을 먼저 만들지 않는다. PostCSS plugin, CSS import, @theme, 필요한 @source를 순서대로 둔다.

1

@tailwindcss/postcss

postcss.config.mjs에 v4 plugin을 연결

2

@import "tailwindcss"

globals.css에서 Tailwind layer를 한 번 불러옴

3

@theme

색·간격·font 같은 디자인 token을 CSS에서 선언

4

@source

자동 탐지 밖의 외부 package만 명시적으로 추가

핵심v4의 기본은 자동 source 탐지와 CSS-first token이다. 예외 경로만 @source로 보완한다.