how to scope library styles to avoid affecting global css?

[adirzoari]

Hello,

I’m working on a project using my own UI kit components (built on PrimeReact). I want to include the styles from the library, but I’d like to restrict their scope so they apply only to the preview of my components.

Currently, if I include the styles in the index.css of my app, they affect the entire application and conflict with Tailwind, causing layout issues, which is not the desired behavior.

Is there a way to inject these styles specifically into the builder or preview environment without affecting the global CSS of the entire page layout?

For example, when I add my UI kit styles, the layout of the editor breaks:

But if I don’t add my UI kit styles, the preview doesn’t render correctly:

Any guidance or recommendations on how to resolve this would be greatly appreciated!

Thank you!