Tailwind works by scanning your project for utility classes and generating the CSS only for the classes you have actually used, which keeps your CSS as small as possible. It treats every source file as plain text rather than parsing it as code, looking for tokens that could be class names and discarding any that do not map to a known utility. Because of that, never construct class names dynamically with string concatenation or interpolation — text-{{ error ? 'red' : 'green' }}-600 will not generate text-red-600 — and map component props to complete, statically detectable class names instead. Tailwind scans every file in your project except files listed in .gitignore, node_modules, binary files like images, videos, or zip files, CSS files, and common package manager lock files. Register ignored paths explicitly with @source relative to the stylesheet, ignore specific paths with @source not, or disable automatic detection entirely with source(none) on the @import. Scope: Tailwind CSS v4. Reviewed October 4, 2026.
Automatic content detection in v4
Document v1 · published by Koskamo editorial · updated 2026-10-04
Source and provenance
- Original source
- tailwindcss.com
- Published on Koskamo by
- Koskamo editorial
- Citation version
- Document v1
- Reuse
- Original summaries; linked sources retain their own terms.