Tailwind styles are being overridden

​

Problem

Starting from version 4, Tailwind CSS uses @layer rules to define its styles.

Makeswift by default includes a CSS reset from normalize.css. Because the built-in CSS reset is unlayered, it’ll override the Tailwind styles, even if the Tailwind styles are more specific.

From MDN @layer documentation: “Styles that are not defined in a layer always override styles declared in named and anonymous layers.”

​

Solution

Disable the built-in CSS reset by setting enableCssReset={false} on the RootStyleRegistry. If you followed the installation docs, this would be located in your lib/makeswift/provider.tsx or src/makeswift/provider.tsx file:

<RootStyleRegistry enableCssReset={false}>
  {children}
</RootStyleRegistry>

Tailwind already ships with its own reset, so disabling the built-in reset prevents conflicts and preserves Tailwind’s styles.