Class name built at runtime

tailwind/dynamic-classwarningcorrectness

Why it matters

Tailwind generates CSS only for class names it finds whole in the source: bg-${color}-500 has no styles.

Fix

Map values to full class names: { red: "bg-red-500", … }[color].

Credit

  • From Tailwind Labs

    Tailwind only generates CSS for class names that appear as complete strings in source files.

References