Can I use panda's utilities layer with tailwindcss's utilities ?

[minsoo-web]

Hi, I'm making a design-system library with pandacss.

During the test to confirm that the tailwindcss side also works without any problems,
I found that pandcss's layer name is same with tailwind's layer, name as utilities

In index.css file is like below

@tailwind base;
@tailwind components;
@tailwind utilities;

/* It was confirmed that the order had no effect. */
@import "../../../packages/components/dist/styles.css";

I think the first solution I thought of would be if the name doesn't overlap with the layer provided by tailwind, is there a way to customize the name of the util layer in pandacss?

Or, is there any other solution you can suggest?

The environment setting of the app code using the package I built with pandacss is as follows.

vite + typescript + tailwindcss + postcss

[astahmer]

I might be wrong, but afaik tailwind doesn't use @layers ? isn't it a custom thing ? so I'm not sure there is going to be a collision, you can probably just try it and see for yourself to make sure you can

[minsoo-web]

Thank you for reply 🙇‍♂️
I will make clear example app using codesandbox.

but, before this example making, I will explain what this situation it is.
Here is tailwindcss docs with vite

https://tailwindcss.com/docs/guides/vite

As the screenshot above, tailwindcss using @tailwind

My app code is below

but, rendered app doesn't has layer base and utilities it is use case of tailwind's name

I will make clear re-producing condition like codesandbox.

Thank you for your reply again.

[anubra266]

#1161