Can I use Joy UI with Material UI together?

Question

I have a React application that uses Joy UI. I would like to use Material UI as well.

Can I use Material UI and Joy UI together in a React app? If so how?

Answer 1

Yes, you can use both on the same page. More details on how at: https://mui.com/joy-ui/guides/using-joy-ui-and-material-ui-together/.

Answer 2

Yes, you can use Joy UI with Material UI, but you will have to implement a workaround, otherwise some components will throw an error and not work well or work at all.

siriwatknp updated the code and wrote a guide about how to use Joy UI and Material UI together. If you dont implement the fix described in the guide, then it will most likely fail when you try to use both libraries in the same project.

See the guide on how to use Joy and Material UI together here: https://github.com/mui/material-ui/blob/master/docs/data/joy/guides/using-joy-ui-and-material-ui/using-joy-ui-and-material-ui.md

:::warning warning Note: Once Joy UI reaches component parity with Material UI, we recommend you to choose one or the other. Not only do they have a different design language (and therefore a different theme structure) but they would increase your bundle size as well as potentially create unnecessary complexities. :::

I believe they will post this guide on the official website soon, but I can only find the guide in their Github repo.

Update:

Guide is now on their official website: https://mui.com/joy-ui/guides/using-joy-ui-and-material-ui-together/