tailwindcss Detecting classes in source files

Understanding and customizing how Tailwind scans your source files.

Tailwind works by scanning your project for utility classes, then generating all of the necessary CSS based on the classes you’ve actually used. This makes sure your CSS is as small as possible, and is also what makes features like arbitrary values possible.

Which files are scanned

Tailwind will scan every file in your project for class names, except in the following cases:

Files that are in your .gitignore file
Binary files like images, videos, or zip files
CSS files
Common package manager lock files

If you need to scan any files that Tailwind is ignoring by default, you can explicitly register those sources.

Explicitly registering sources

Use @source to explicitly register source paths that Tailwind ignores by default:

@import “tailwindcss”; @source “../node_modules/@acmecorp/ui-lib”;

Disabling automatic detection

Use source(none) to completely disable automatic source detection if you want to register all of your sources explicitly:

@import “tailwindcss” source(none); @source “../admin”; @source “../shared”;

Source: https://tailwindcss.com/docs/detecting-classes-in-source-files#which-files-are-scanned