Tailwind CSS — co to jest i czemu zastępuje tradycyjne CSS

01Tailwind CSS to utility-first CSS framework stworzony przez Adama Wathana (2017). Główna idea: zamiast pisać własne klasy CSS (`.button-primary { background: blue; padding: 12px; }`), używasz gotowych utility klas inline (`<button class='bg-blue-500 px-3 py-2'>`).

02Korzyści: szybszy dev (nie trzeba wymyślać nazw klas), mniejszy bundle CSS (purge unused classes), spójny design system (predefined spacing/colors/typography scale), łatwiejszy refactor (zmieniasz HTML, CSS sam się dostosuje).

03Krytyka: 'klasy w HTML brzydkie', 'ciężko czytać'. To rzeczywiście wymaga przyzwyczajenia, ale po 2 tygodniach pracy z Tailwindem nie chcesz wracać do tradycyjnego CSS.

04Tailwind 4 (2025) — najnowsza wersja: CSS-first config (`@theme` w globals.css zamiast tailwind.config.js), 5x szybszy build, native CSS variables, automatic content detection. Przeskoczył Bootstrap i CSS Modules pod względem popularności.

05Stack typowy 2026: Next.js + Tailwind 4 + shadcn/ui (komponenty zbudowane na Tailwind, kopiujesz do projektu zamiast importować). To stack którego używa 70%+ nowych projektów React/Next.js.

06Praktyczna rada: jeśli budujesz nowy projekt, zacznij z Tailwindem. Jeśli masz stary projekt z CSS Modules / styled-components, migracja na Tailwind nie jest priorytetem — to 'optymalizacja DX', nie funkcjonalność. Migruj jak będziesz przepisywać komponenty.