Default Tailwind setup:
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer components {
/* … */
}Instead, use standard CSS @layers:
@layer tailwind-base, tailwind-components, my-styles, tailwind-utilities;
@layer tailwind-base { @tailwind base; }
@layer tailwind-components { @tailwind components; }
@layer tailwind-utilities { @tailwind utilities; }
@layer my-styles {
/* … */
}Use theme() instead of @apply:
No:
img { @apply border-2xl; }Yes:
img { border-radius: theme(borderRadius.2xl); }