How Tailwind scans source files

Class detection

Tailwind scans your project source for class candidates and generates the corresponding CSS. This is why class names need to appear in a form Tailwind can detect.

Static class names are safest

Do not assume Tailwind will understand arbitrary runtime string construction such as "bg-" + color + "-500". If the complete class names do not appear in detectable source, the required CSS may not be generated.

Use explicit mappings

When a value is dynamic, map application states to complete class strings. This keeps the generated CSS predictable and makes the design choices visible.