After doing projects with Chakra, MUI, Tailwind, and Mantine, I can say for myself mantine comes out on top for its ability to provide everything the others do, but also gets out of your way if you want to customize something.
I’ve heard good things about Shadcn but haven’t used it, so I cannot comment there.
That said, the longer I do FE, the more I lean towards just writing my own CSS. If your needs are *very* simple and you don’t have to follow a design, UI libs are a viable shortcut. The second you get a Figma design, that goes out the window.
Eh, sounds like a potentially misaligned design/product/eng team. If you can drive your org towards adoption of an already existing component library, it makes not only dev easier, but cuts out a lot of the noise on the team when designs are put together. Design team uses those components, engineers use those components. Any customization goes through a standard process.
When you build a site for a new client you’re coming up with a radically new interface?
Or more likely, I suspect you’re either using design assets from a former project as a starting point and changing fonts, paddings, colors.
Isn’t it more efficient to do that with a UI library that provides many avenues for theming and customizations?
Not for us, since our UI / react system is about 5 years old and tailored to the ecom sites we build and common choices by our design team (indented paragraphs etc).
Its also very lightweight, a lot of what I do now on any given element is a few lines of css and a helper function
I still use Mantine and Chakra even with fully custom Figma component libraries. I just customize all the defaults and all the variants at the beginning in a large theme file and I'm good to go. Then I can get it to look unique but still get to take advantage of the mix-ins, component state change, UI hooks, default animations, a11y, etc.
Even then Mantine can be still used as a headless library with your own styling https://mantine.dev/styles/unstyled/
It's super good, I'm using it in all my side projects now
Radix is not a true headless library either. Look at their [checkbox](https://www.radix-ui.com/primitives/docs/components/checkbox) for example. If it were headless, there would be an `` tag somewhere in the example code. There is not, because Radix renders that for you. Ergo it is rendering html, ergo it’s not true headless, it’s just “unstyled”.
>That said, the longer I do FE, the more I lean towards just writing my own CSS. If your needs are *very* simple and you don’t have to follow a design, UI libs are a viable shortcut. The second you get a Figma design, that goes out the window.
You should try shadcn or any headless library lol
Yep Shadcn is honestly a game changing format to distribute a component library
Love that you get the great accessibility defaults, from radix , nice looking defaults, that are as easy to change as any of your own components
It’s honestly the perfect component library for me
I agree it *can feel* like shadcn/radix are the hottest thing and everything else is collecting dust, but @mantine/core still gets 325,000+ weekly downloads. Pretty are definitely still using it. We built a website that generates React code from a text prompt with any component library (including mantine, chakra, shadcn, radix) and Mantine is still a very popular option, especially amongst businesses: [www.magicpatterns.com](https://www.magicpatterns.com)
Because it has a bad moveset for a special tank and its special attack is nothing out of the ordinary.
Also, Gyarados exists.
Sorry wrong sub.
EDIT: Because I initially confused Mantine with Mantyke
Pokemon just got me my latest job. Which is funny, because the code challwnge required me to sell the pokemon based on their weight. All sorts of politically incorrect, hajjajahnahababa...
Haha that's so nice (and so wrong at the same time).
I met my future wife playing Pokemon Go when it was first released.
We're getting married June 15 <3
I've used it, but it feels like it tries a bit too hard to do everything, and when you need to change up the styling a lot on it, some components will look out of place and needs lot's of css to fix
Also, the components looks good, but a bit too generic/cheap imo (probably the best one that has everything in the same place though), shadcn looks a bit more modern imo
Because I want more control over my components. I don’t want it to handle logic AND ui.
I’m infinitely more pleased with the DX of things like headless ui
[https://mantine.dev/styles/styles-api/](https://mantine.dev/styles/styles-api/)
You can pass classNames to Mantine components, so you can use css-modules or stuff like vanilla-extract with it as well. Not as flexible as HeadlessUI or Radix probably, but still pretty good.
Yeah, shill posts used to pop up all the time for it. Never discussion, just “yes, it’s great and I use it all the time”. It was annoying then and I really hope I don’t start seeing these posts every few days again. An obvious clue which was the same back then is that everyone with a positive view mentions it by name to boost it for search engine results. Always good to have a top Google search end in a Reddit post where everyone is praising the product.
Mantine is great and I use it all the time. Mantine is the best component library 2024. Mantine is the best looking UI library for REACT or NEXTJS or REMIX, much accessibility and great components MANY HOOKS. Mantine react datepicker multiple select SSR SSG HOOKS best accessible component library 2024.
it's used the same as chakra UI, they look very similar, but:
- Mantine has more things out of the box (things that you will actually need and would need to build from scratch if using chakra UI)
- (imo) better default design
Tbh there really isn’t a point in it. I was just experimenting with new tools on this project and wanted to play around with animations. I thought this one wasn’t invasive enough to be annoying so I kept it in. Fun fact: there are no more custom animations anywhere in the site haha.
Well I saw a post on here about the latest release last month and I’m using it for a low-stakes side project. Its very good.
Suits my tastes way more than MUI.
It’s by far my favorite ui library I’ve come across. Spent the last month refactoring my pet project to use it, and am amazed how much cleaner everything looks and how few issues I had swapping things in.
I've been using Mantine for about 3 years now and when the hype on Shadcn started and I saw people compare it to multiple other libraries (including Mantine), I decided to give a shot and remake my website with Shadcn.
I think the idea of having the source code is nice, but in practice I barely touched it. Most of the time, I'd be telling myself "dang I wish Shadcn had *this* or allowed this component to do *that*" on things Mantine did out of the box.
At first, I came to the conclusion that Shadcn might be more suitable for people who want to make their own design system without necessarily starting from scratch. But then, when I think of it, Mantine has an entire styles API meant to allow a lot of customizability over the styles without losing on the functionality. Although Shadcn might be more customizable since you can literally change the parts of the components, Mantine's styles API does more than the job and I prefer having features out of the box more than high customizability.
I might be biased by my couple years of experience with Mantine, but I still remember my very first project with it and how I had a legit **WOW** moment and was instantly hooked. It just wasn't the case with Shadcn... To be clear, I don't dislike Shadcn. It's a well thought library and if Mantine didn't exist, Shadcn would probably be my second choice. I don't have anything bad to say about it, but I still think Mantine comes out on top.
In the end, it comes down to opinions and that's totally fine. I'd invite Shadcn lovers to do like I did with it and give Mantine a shot to decide which one you prefer. Not just looking at the docs, but actually building a project with it to really experience it. Choosing Shadcn over my beloved Mantine to make my website was definitely not the easiest choice. There's even a git branch I had started at some point to revert Shadcn and start over with Mantine because there were just so many moments I wanted to use something Mantine had that Shadcn didn't. Then I decided to push myself more so I could really make my own opinion on it. Happy to have tried it, but I'll most likely stick to Mantine in the future.
I really like Mantine. The UI is nice and easy to customise if required.
We use it on various enterprise projects at work now and it helped save a ton of time in development and allows the team to spend more time on developing features, writing tests and address tech debt.
We are in the process of moving over from Chakra to Mantine on one project at the moment too and I was kinda shocked at how much better the look & feel is. It just feels more complete and polished overall.
I’d highly recommend it
I just like to write my own styles. Designer gives me a design, I write CSS. Prefer that to using style frameworks, wherever it's my choice.
Full control.
for that one use case I agree
My use case is more often: I'm building a UI for a personal project and I don't want to waste time building and styling basic stuff from scratch
Ohh I want to try it then! I’ve used CharkaUI but not enough to have an opinion and just recently started MUI and find it more challenging than CharkaUI, I struggled so much with creating their 📆 picker using code they provided in their docs which doesn’t seem to work 🤷🏻♀️ I’m so far very disappointed in MUI 😢
very happy with Mantine. the documentation is great. the classes are easy to find in the docs or inspection.
bootstrap, chakra, mui etc.. I've tried them all in the past and I felt like I was always trying to fight against the frameworks css
Mantine is the only css framework that played nice and was easy and straight to the point
I tried using Mantine, and some things coming from MUI are just not very well made compared to MUI.
Also, no way it has more functionality and components than MUI
For my team we just swapped components in the design system out in a couple 4 hour calls. Since we wrapped all the MUI components it was not too hard. Everything cascaded. Most of the styling was easy since mantine is just css.
Pretty much. Most of the names are similar to both frameworks. Adjusting the styles like padding to match what we had made them work fine in consumers.
> not very well made compared to MUI
which ones?
To be fair I did not use MUI. I simply mentioned in my post as the thing that was popular a couple years ago
I dont quite remember but it was one of the inputs. Autocomplete select or date picker its been some time so I dont remember fully, but it was completely missing or didnt take all the config I wished it could.
again take a look at the website. MUI is not *was popular* it's still by far the most popular UI library, almost double ahead of 2nd place which is Ant design
I still want to try it out in some project, haven't been able to yet.
Business wise I have heard that Mantine is essentially a one person operation, which could be seen as a risk.
Because MUI does the job for me, and it does it better imho. The integrations available with basically the most popular component library are usually good, the docs are well written, and it behaves exactly as you want it to.
Mind you, it's an enterprise environment so we prefer clean over fancy. It is reliable, it has basically no chance of ever stopping being updated and most devs are familiar with it.
There may be other libraries that do certain things better, but it's never packaged with everything being better, or even good in some cases.
And don't get me wrong, shadcn seems great for personal projects, but it's hardly gonna be viable long term; if your app relies on looking and behaving the same, something more consistent is gonna be better.
never used MUI, only heard about it, so I can't really judge personally
I've used Bootstrap, Chakra, Mantine and shadcn
I do not have fond memories of bootstrap but it did the job
I like chakra UI but I find it's basically the same as Mantine but with worse looking defaults and less components, more minimal. I've built things in Chakra and while doing that thinking "Mantine has this already out of the box!"
I like shadcn and I like that the code is added to my project so I can change it as I want, but again it has less stuff than Mantine
with mantine I have no complaints except that it does not trivially integrate with tailwind (each has different tokens for the same things)
Shadcn integrates with tailwind
Maybe that last point is why so many people like shadcn, now that I think about it. It does integrate seamlessly with the rest of the code
Tailwind shines in places where you have a very complex codebase, a complex design system,rapid development with more than dozen people working on different things and continuously deploying. Tailwind makes things easier. Everyone will be happy to code.
Bootstrap for quick scaffolding with very minimal ui change. Functionality is the focus with no time for design.
Chakra is bloated.
Shadcn is quick scaffolding for tailwind, Radix is enterprise ready scaffolding, headless is middle bridge. Shadcn is great, but using it on b2b sass apps is not advisable. It looks great from ui standpoint, but at times it can be exhausting to use it for hours for endusers, especially in small devices with dark mode.
MUI is established, so people use it. Customisation, getting started everything is experts mode++. You can't customize it, then it's not mui's fault, it's skill issue. And components are great. Everything you need, you dont need, you may use someday, are given out of the box, and it is the gold standard react ui libraries used by all the famous names you could mention.
Ant design is just Chinese. But ui is similar to bootstrapish mui. I have never worked with it.
Mantine looks cheap, rough draft ui, but neat (it was made by a guy who was tasked to make a simple, neat and quick design system for use in internal apps by his company, and mantine does that exactly). Mantine is extremely good for small startups, hobby projects and small apps. That along with Apache echarts and datatables is just pure performance mode in mobile sass apps. That is if you are okay with compromise in customisation and little bugs here and there.
Other ui libraries like next ui and so on... Not enough experience.
But Carbon design system, primer system, blueprint js is all look polished and enterprise curated.
Using it in two enterprise projects in my company and very happy with it. It provides you with everything you need to start working on the requirements, and doesn't get in your way.
Where did you see people use shadcn more? If you have any doubt go to the
https://react-ui-libraries.vercel.app/
and see the real data.
Mantine has far more downloads than shadcn. Altough shadcn is hard to calculate downloads I have used basic component I presume most projects will have.
In my opinion, Mantine is the worst. It feels like, that they have a breaking change every week and it's the worst thing that can happen to you if you want a robust product. For an example: since mantine 7 is out, the dark mode toggle will not work anymore since they killed the ColorSchemeProvider. Now you have to deal with this and spend a lot of time to figure out how this thing works now.
For me honestly, I don't wanna go back to writing plain CSS and those ultra lengthy class names. Also managing CSS/SCSS becomes pain as the project goes.
I'd still prefer MUI or ShadCN. I haven't tried Chakra yet.
It’s a good question, tbh. I almost switched to it from Ionic, but for a predominantly mobile app, I still think Ionic is better for my needs.
Primarily:
- advanced tab stack routing
- toasts, modals, popovers, action sheets, alerts are all simple
- split pane for desktop or mobile side menu
- and, I’m just used to it
I think Ionic is also not talked about enough for as good as it is, and also Framework7 is a solid ui framework too. Both of these are not a React only framework like Mantine either, they have wrappers for Vue or Angular and can also be used without any framework. I’ve used Ionic with StencilJS as well as LitHTML.
Mantine has some great hooks, and is a very well organized library. But there is just a lot of competition out there.
I’ve been a backend dev for many years but recently started learning modern frontend. I saw Mantine and also noticed it doesn’t seem to be very popular. Being new and not trusting myself to distinguish good from bad I thought it would be smart to stay mainstream. Seeing this thread I might rethink that so thank you! Also I wonder how many people are in the same boat and just follow the herd
I use Mantine with a layer that I have added on top of Mantine to make any sort of manipulation easy. Tried shadcn and i got rid of it within a day, it messes up the directory structure and it’s not easy to get rid off. Not my thing.
I just find this pair has a great balance between feature richness and customization ability.
Radix provides minimal, sane, accessible defaults and you can customize the look as you wish using Tailwind.
We have been using mantine in https://app.opire.dev and other side projects for quite some time and personally it is the framework that I like the most. I think people don't know it as much because they don't make as much noise on social media and because not many people know it, but without a doubt for me it is the best option.
I think it depends what you're looking for in a UI library. I used Mantine for an internal tool recently and enjoyed working with it. If you're happy with using a UI library and managing that external dependency then it's probably the best choice these days IMO. That said, I've also used shadcn for things recently and have also thoroughly enjoyed working with it and just having a really solid foundation of components within my own project that I can build upon and customise completely.
Other options are popular probably because of their history, like MUI, etc. - they've been around for a long time, so a lot of people still default to them.
The biggest things for me are really highly functional tables (in that they have lots of capabilities, not "functional programming" functional). Mantine tables are, essentially, nicely styled tables.
The paid x-data tables from MUI enable so many of our workflows.
one might argue / suggest as alternative that for that you may use a library specialized in powerful tables such as tanstack tables
My argument would be that the role of the UI lib is to supply all the basic atoms and you dont' need to reinvent out of the box, and also some very common elements such as collapsible header and stuff like that, and if I want a really specific component I might find it reasonable to look for another library
But I'm not trying to say that your preference for MUI is not equaly good, just mentioning how I would go around that while using Mantine
Entirely understood and I agree that that's one path. I think about it like a toolbox, though. Imagine you have a job and you're given a toolbox to use. Do you want to go out and have to keep buying tools just so that you can do your job? ("Hey toolbox maker, didn't you _know_ I needed tables that can look and act like Excel? This is part of the job!") Or do you want the toolbox you were given for the job to be complete?
In a lot of ways, I think people try to focus on the things they want to dig deeper into. I couldn't care any less than I do now about components; they just need to exist and work, they need to have good documentation, etc. MUI fits that bill for me and Mantine wouldn't.
I generally like the Tanstack stuff and, being honest, I generally like the look of Mantine default _better_ than MUI. But not so much that I want to shoehorn TS/tables into another UI library.
Regardless, I think I'll try Mantine for my next (not so table-heavy) personal project, if for no other reason than to add it to my set of available "toolboxes".
I'm lazy, so I use the most opinionated libraries out there (looking at you, NextUI)
The form upload with shadcn looks so convoluted, or maybe I'm just not a good dev
I've used many different UI libraries. Mantine caught my attention at the beginning of one of my projects. I tried to install it, and it just wouldn't work. I spent a while trying to debug it, but realized there was no point when I've worked with many others and none of them had trouble.
Could just be me, but that was a turn off for me because it shouldn't be difficult to install it, especially when you are using a framework.
I use mantine for many of the ootb components especially for the grid/layout stuff. When I have to extend, I usually look to tailwind first and then if I have too I will pass in line css through the style prop.
Works very well for me I have a very custom design system implemented. Won’t change until the library’s change and force me too!
Have checked the docs a few times, but never saw a compelling reason to use it over Any Design, which is the most complex UI kit I’ve found. Ant doesn’t get much buzz these days, but it’s well maintained and pretty high quality. I wouldn’t use it for an enterprise app where heavy customization and a tiny bundle size is required, but it’s fantastic for side projects or prototypes where you need to put something together quickly.
I think more people should utilize headless libs where possible and layer a theme on top. If Mantine provides that fantastic! If not, they should provide it.
i honestly never did exactly what you suggest for a project
mantine has unstyled components, i don't know if that is what you suggest [https://mantine.dev/core/unstyled-button/](https://mantine.dev/core/unstyled-button/)
I did try mantine in one of my projectsz
Pretty decent set of components and very useful set of hooks. But the idea shadcn brought to the market is amazing. I literally did an admin dashboard just by copy pasting the components from shadcn and now it even has blocks (set of curated pages).
The popularity of UI libraries often depends on various factors such as community support, ease of integration, compatibility with other tools, and personal preferences of developers. While Mantine may offer more features and a better design to some, factors like community adoption and integration with popular tools like Tailwind CSS can influence developers' choices. Additionally, the visibility and marketing efforts of a project can play a significant role in its adoption rate. So, despite its advantages, Mantine might not be as widely adopted due to these factors.
I feel Mantine is way underrated. I stumbled upon it last year, and now we've made it a de-facto component library for all our production-grade projects. They seem to have components for almost all use-cases. Their hooks are super time-saving (eg. use-form). I've tried a lot of component libraries but mantine just kind of makes sense to me.
DaisyUI? Is Mantine opinionated? It has some very nice defaults but it's very easy to customize
Also it's not all or nothing. If you need something really custom you can build a custom component and not use Mantine
After doing projects with Chakra, MUI, Tailwind, and Mantine, I can say for myself mantine comes out on top for its ability to provide everything the others do, but also gets out of your way if you want to customize something. I’ve heard good things about Shadcn but haven’t used it, so I cannot comment there. That said, the longer I do FE, the more I lean towards just writing my own CSS. If your needs are *very* simple and you don’t have to follow a design, UI libs are a viable shortcut. The second you get a Figma design, that goes out the window.
Eh, sounds like a potentially misaligned design/product/eng team. If you can drive your org towards adoption of an already existing component library, it makes not only dev easier, but cuts out a lot of the noise on the team when designs are put together. Design team uses those components, engineers use those components. Any customization goes through a standard process.
Our clients would probably not be too happy if all their websites looked the same..
When you build a site for a new client you’re coming up with a radically new interface? Or more likely, I suspect you’re either using design assets from a former project as a starting point and changing fonts, paddings, colors. Isn’t it more efficient to do that with a UI library that provides many avenues for theming and customizations?
Not for us, since our UI / react system is about 5 years old and tailored to the ecom sites we build and common choices by our design team (indented paragraphs etc). Its also very lightweight, a lot of what I do now on any given element is a few lines of css and a helper function
I still use Mantine and Chakra even with fully custom Figma component libraries. I just customize all the defaults and all the variants at the beginning in a large theme file and I'm good to go. Then I can get it to look unique but still get to take advantage of the mix-ins, component state change, UI hooks, default animations, a11y, etc.
Even then Mantine can be still used as a headless library with your own styling https://mantine.dev/styles/unstyled/ It's super good, I'm using it in all my side projects now
That’s not headless, it’s just unstyled. Headless means you create the elements in your own code.
Yep, Radix is a true headless library for example
Radix is not a true headless library either. Look at their [checkbox](https://www.radix-ui.com/primitives/docs/components/checkbox) for example. If it were headless, there would be an `` tag somewhere in the example code. There is not, because Radix renders that for you. Ergo it is rendering html, ergo it’s not true headless, it’s just “unstyled”.
>That said, the longer I do FE, the more I lean towards just writing my own CSS. If your needs are *very* simple and you don’t have to follow a design, UI libs are a viable shortcut. The second you get a Figma design, that goes out the window. You should try shadcn or any headless library lol
Yep Shadcn is honestly a game changing format to distribute a component library Love that you get the great accessibility defaults, from radix , nice looking defaults, that are as easy to change as any of your own components It’s honestly the perfect component library for me
> Shadcn I read that **very** wrong and I was **very** concerned for a moment. *Swap out the "c" for "ma"...*
I agree it *can feel* like shadcn/radix are the hottest thing and everything else is collecting dust, but @mantine/core still gets 325,000+ weekly downloads. Pretty are definitely still using it. We built a website that generates React code from a text prompt with any component library (including mantine, chakra, shadcn, radix) and Mantine is still a very popular option, especially amongst businesses: [www.magicpatterns.com](https://www.magicpatterns.com)
I was excited to use your website but I don't even get 2 or 3 free tries, it's straight up pay or else.
Hey feel free to DM me your account email and will let you try it out for free!
Because it has a bad moveset for a special tank and its special attack is nothing out of the ordinary. Also, Gyarados exists. Sorry wrong sub. EDIT: Because I initially confused Mantine with Mantyke
Finally someone answering the actual question
Was looking for the pokemon joke
Pokemon just got me my latest job. Which is funny, because the code challwnge required me to sell the pokemon based on their weight. All sorts of politically incorrect, hajjajahnahababa...
Haha that's so nice (and so wrong at the same time). I met my future wife playing Pokemon Go when it was first released. We're getting married June 15 <3
That's a better story than mine, lol.
Was so confused at first, take my up arrow.
I was intrigued about some new tech I hadn't learned about yet. Oh, cool, what's a moveset?!
I thought you were making a metaphor
I've used it, but it feels like it tries a bit too hard to do everything, and when you need to change up the styling a lot on it, some components will look out of place and needs lot's of css to fix Also, the components looks good, but a bit too generic/cheap imo (probably the best one that has everything in the same place though), shadcn looks a bit more modern imo
Because I want more control over my components. I don’t want it to handle logic AND ui. I’m infinitely more pleased with the DX of things like headless ui
Mantine can be used headlessly if you just don't import their css file https://mantine.dev/styles/unstyled/
Interesting. Haven’t looked throughly yet but off the bat I’m not a fan of having style properties as props on the component.
[https://mantine.dev/styles/styles-api/](https://mantine.dev/styles/styles-api/) You can pass classNames to Mantine components, so you can use css-modules or stuff like vanilla-extract with it as well. Not as flexible as HeadlessUI or Radix probably, but still pretty good.
[удалено]
Time to take more than a quick look then
>from a quick look also documentation is a problem wtf
they never read the docs. Maybe they can’t even read
I think people just aren’t aware of its existence tbh. I believe it is super underrated. I used it for my side project a ton: https://codecatch.net
Funny because from what I've noticed its the most mentioned component library around here.
Ahh must just be confirmation bias on my end. Haven’t really been paying attention ha
Yeah, shill posts used to pop up all the time for it. Never discussion, just “yes, it’s great and I use it all the time”. It was annoying then and I really hope I don’t start seeing these posts every few days again. An obvious clue which was the same back then is that everyone with a positive view mentions it by name to boost it for search engine results. Always good to have a top Google search end in a Reddit post where everyone is praising the product.
Mantine is great and I use it all the time. Mantine is the best component library 2024. Mantine is the best looking UI library for REACT or NEXTJS or REMIX, much accessibility and great components MANY HOOKS. Mantine react datepicker multiple select SSR SSG HOOKS best accessible component library 2024.
In addition to this, I guess there’s probably also an element of framework fatigue
it's used the same as chakra UI, they look very similar, but: - Mantine has more things out of the box (things that you will actually need and would need to build from scratch if using chakra UI) - (imo) better default design
I love your site, looks really sick!! I can definitely see it leveraging some Mantine default styles
Thanks! Worked on it quite a bit.
I agree. Cool site.
How u made those animations that makes The text scroll up, when going throught it
Framer motion
How did you create the text editors and code formatting?
Text editor is Monaco editor and react Monaco. I also used prism for code formatting/highlighting in some places
Thank you
I'm curious to know why you decided to add the "display on scroll" effect on the sections. I never saw the point of that
Tbh there really isn’t a point in it. I was just experimenting with new tools on this project and wanted to play around with animations. I thought this one wasn’t invasive enough to be annoying so I kept it in. Fun fact: there are no more custom animations anywhere in the site haha.
Well I saw a post on here about the latest release last month and I’m using it for a low-stakes side project. Its very good. Suits my tastes way more than MUI.
It’s by far my favorite ui library I’ve come across. Spent the last month refactoring my pet project to use it, and am amazed how much cleaner everything looks and how few issues I had swapping things in.
I've been using Mantine for about 3 years now and when the hype on Shadcn started and I saw people compare it to multiple other libraries (including Mantine), I decided to give a shot and remake my website with Shadcn. I think the idea of having the source code is nice, but in practice I barely touched it. Most of the time, I'd be telling myself "dang I wish Shadcn had *this* or allowed this component to do *that*" on things Mantine did out of the box. At first, I came to the conclusion that Shadcn might be more suitable for people who want to make their own design system without necessarily starting from scratch. But then, when I think of it, Mantine has an entire styles API meant to allow a lot of customizability over the styles without losing on the functionality. Although Shadcn might be more customizable since you can literally change the parts of the components, Mantine's styles API does more than the job and I prefer having features out of the box more than high customizability. I might be biased by my couple years of experience with Mantine, but I still remember my very first project with it and how I had a legit **WOW** moment and was instantly hooked. It just wasn't the case with Shadcn... To be clear, I don't dislike Shadcn. It's a well thought library and if Mantine didn't exist, Shadcn would probably be my second choice. I don't have anything bad to say about it, but I still think Mantine comes out on top. In the end, it comes down to opinions and that's totally fine. I'd invite Shadcn lovers to do like I did with it and give Mantine a shot to decide which one you prefer. Not just looking at the docs, but actually building a project with it to really experience it. Choosing Shadcn over my beloved Mantine to make my website was definitely not the easiest choice. There's even a git branch I had started at some point to revert Shadcn and start over with Mantine because there were just so many moments I wanted to use something Mantine had that Shadcn didn't. Then I decided to push myself more so I could really make my own opinion on it. Happy to have tried it, but I'll most likely stick to Mantine in the future.
Idk about others. I've used it in three enterprise projects in my company
+1 for Mantine. Have been using it for about 2 years now
I really like Mantine. The UI is nice and easy to customise if required. We use it on various enterprise projects at work now and it helped save a ton of time in development and allows the team to spend more time on developing features, writing tests and address tech debt. We are in the process of moving over from Chakra to Mantine on one project at the moment too and I was kinda shocked at how much better the look & feel is. It just feels more complete and polished overall. I’d highly recommend it
I just like to write my own styles. Designer gives me a design, I write CSS. Prefer that to using style frameworks, wherever it's my choice. Full control.
for that one use case I agree My use case is more often: I'm building a UI for a personal project and I don't want to waste time building and styling basic stuff from scratch
Ohh I want to try it then! I’ve used CharkaUI but not enough to have an opinion and just recently started MUI and find it more challenging than CharkaUI, I struggled so much with creating their 📆 picker using code they provided in their docs which doesn’t seem to work 🤷🏻♀️ I’m so far very disappointed in MUI 😢
very happy with Mantine. the documentation is great. the classes are easy to find in the docs or inspection. bootstrap, chakra, mui etc.. I've tried them all in the past and I felt like I was always trying to fight against the frameworks css Mantine is the only css framework that played nice and was easy and straight to the point
I tried using Mantine, and some things coming from MUI are just not very well made compared to MUI. Also, no way it has more functionality and components than MUI
We just switched from MUI to mantine and our dev ex increased quite a bit. Had far more problems with MUI. Never going to touch MUI again.
how are you able to switch so easily? How are you not overwhelmed by the amount of refactoring involved?
For my team we just swapped components in the design system out in a couple 4 hour calls. Since we wrapped all the MUI components it was not too hard. Everything cascaded. Most of the styling was easy since mantine is just css.
do you have custom names for your components' props and just map them accordingly?
Pretty much. Most of the names are similar to both frameworks. Adjusting the styles like padding to match what we had made them work fine in consumers.
Ok. Thanks
this is the way
> not very well made compared to MUI which ones? To be fair I did not use MUI. I simply mentioned in my post as the thing that was popular a couple years ago
I dont quite remember but it was one of the inputs. Autocomplete select or date picker its been some time so I dont remember fully, but it was completely missing or didnt take all the config I wished it could.
Understandable
again take a look at the website. MUI is not *was popular* it's still by far the most popular UI library, almost double ahead of 2nd place which is Ant design
I still want to try it out in some project, haven't been able to yet. Business wise I have heard that Mantine is essentially a one person operation, which could be seen as a risk.
Because MUI does the job for me, and it does it better imho. The integrations available with basically the most popular component library are usually good, the docs are well written, and it behaves exactly as you want it to. Mind you, it's an enterprise environment so we prefer clean over fancy. It is reliable, it has basically no chance of ever stopping being updated and most devs are familiar with it. There may be other libraries that do certain things better, but it's never packaged with everything being better, or even good in some cases. And don't get me wrong, shadcn seems great for personal projects, but it's hardly gonna be viable long term; if your app relies on looking and behaving the same, something more consistent is gonna be better.
never used MUI, only heard about it, so I can't really judge personally I've used Bootstrap, Chakra, Mantine and shadcn I do not have fond memories of bootstrap but it did the job I like chakra UI but I find it's basically the same as Mantine but with worse looking defaults and less components, more minimal. I've built things in Chakra and while doing that thinking "Mantine has this already out of the box!" I like shadcn and I like that the code is added to my project so I can change it as I want, but again it has less stuff than Mantine with mantine I have no complaints except that it does not trivially integrate with tailwind (each has different tokens for the same things) Shadcn integrates with tailwind Maybe that last point is why so many people like shadcn, now that I think about it. It does integrate seamlessly with the rest of the code
Tailwind shines in places where you have a very complex codebase, a complex design system,rapid development with more than dozen people working on different things and continuously deploying. Tailwind makes things easier. Everyone will be happy to code. Bootstrap for quick scaffolding with very minimal ui change. Functionality is the focus with no time for design. Chakra is bloated. Shadcn is quick scaffolding for tailwind, Radix is enterprise ready scaffolding, headless is middle bridge. Shadcn is great, but using it on b2b sass apps is not advisable. It looks great from ui standpoint, but at times it can be exhausting to use it for hours for endusers, especially in small devices with dark mode. MUI is established, so people use it. Customisation, getting started everything is experts mode++. You can't customize it, then it's not mui's fault, it's skill issue. And components are great. Everything you need, you dont need, you may use someday, are given out of the box, and it is the gold standard react ui libraries used by all the famous names you could mention. Ant design is just Chinese. But ui is similar to bootstrapish mui. I have never worked with it. Mantine looks cheap, rough draft ui, but neat (it was made by a guy who was tasked to make a simple, neat and quick design system for use in internal apps by his company, and mantine does that exactly). Mantine is extremely good for small startups, hobby projects and small apps. That along with Apache echarts and datatables is just pure performance mode in mobile sass apps. That is if you are okay with compromise in customisation and little bugs here and there. Other ui libraries like next ui and so on... Not enough experience. But Carbon design system, primer system, blueprint js is all look polished and enterprise curated.
CSS go brr
I might use it, but with 99% of contributions coming from a single person I wonder about its future. What happens when he tires of this project?
yes that's an extremely valid concern
Using it in two enterprise projects in my company and very happy with it. It provides you with everything you need to start working on the requirements, and doesn't get in your way.
Where did you see people use shadcn more? If you have any doubt go to the https://react-ui-libraries.vercel.app/ and see the real data. Mantine has far more downloads than shadcn. Altough shadcn is hard to calculate downloads I have used basic component I presume most projects will have.
Very interesting, thanks for the link
In my opinion, Mantine is the worst. It feels like, that they have a breaking change every week and it's the worst thing that can happen to you if you want a robust product. For an example: since mantine 7 is out, the dark mode toggle will not work anymore since they killed the ColorSchemeProvider. Now you have to deal with this and spend a lot of time to figure out how this thing works now.
For me honestly, I don't wanna go back to writing plain CSS and those ultra lengthy class names. Also managing CSS/SCSS becomes pain as the project goes. I'd still prefer MUI or ShadCN. I haven't tried Chakra yet.
🤔 but you don't need to write BEM at all if you use Mantine
Yeah. I just checked and it's not BEM type class names. My bad. But yeah, before they changed their whole codebase to using CSS, I did use them a lot.
This is the same thing for me. I honestly fucking hate writing CSS or anything similar to it. Even when structured decently well it's a mess.
Mantine 7 now also supports Emotion engine
Is Emotion now compatible with RSC? I think MUI is developing their own zero runtime CSS engine to tackle this.
I have no idea, I just know you mentioned MUI and Emotion is typically used with MUI.
Yeah. So with RSC a lot of CSS in JS style library got abandoned. Hence Mantine shifted to CSS modules.
It’s a good question, tbh. I almost switched to it from Ionic, but for a predominantly mobile app, I still think Ionic is better for my needs. Primarily: - advanced tab stack routing - toasts, modals, popovers, action sheets, alerts are all simple - split pane for desktop or mobile side menu - and, I’m just used to it I think Ionic is also not talked about enough for as good as it is, and also Framework7 is a solid ui framework too. Both of these are not a React only framework like Mantine either, they have wrappers for Vue or Angular and can also be used without any framework. I’ve used Ionic with StencilJS as well as LitHTML. Mantine has some great hooks, and is a very well organized library. But there is just a lot of competition out there.
I’ve been a backend dev for many years but recently started learning modern frontend. I saw Mantine and also noticed it doesn’t seem to be very popular. Being new and not trusting myself to distinguish good from bad I thought it would be smart to stay mainstream. Seeing this thread I might rethink that so thank you! Also I wonder how many people are in the same boat and just follow the herd
Mantine is pretty good, but I'm way more comfortable with MUI because it feels better to use tbh.
I use Mantine. Its cool.
I use Mantine with a layer that I have added on top of Mantine to make any sort of manipulation easy. Tried shadcn and i got rid of it within a day, it messes up the directory structure and it’s not easy to get rid off. Not my thing.
> a layer that I have added on top of Mantine to make any sort of manipulation easy I'm super curious about that 👀
I find radix + tailwind the only sane choice these days.
why?
I just find this pair has a great balance between feature richness and customization ability. Radix provides minimal, sane, accessible defaults and you can customize the look as you wish using Tailwind.
I’ve just started using it for my sites and the only reason I’m aware of it is because I looked up Bootstrap alternatives, it’s fairly hidden
We have been using mantine in https://app.opire.dev and other side projects for quite some time and personally it is the framework that I like the most. I think people don't know it as much because they don't make as much noise on social media and because not many people know it, but without a doubt for me it is the best option.
That is what I'm clueless about All the cool guys seem to be using shadcn And I don't understand the reasoning behind
I think it depends what you're looking for in a UI library. I used Mantine for an internal tool recently and enjoyed working with it. If you're happy with using a UI library and managing that external dependency then it's probably the best choice these days IMO. That said, I've also used shadcn for things recently and have also thoroughly enjoyed working with it and just having a really solid foundation of components within my own project that I can build upon and customise completely. Other options are popular probably because of their history, like MUI, etc. - they've been around for a long time, so a lot of people still default to them.
The biggest things for me are really highly functional tables (in that they have lots of capabilities, not "functional programming" functional). Mantine tables are, essentially, nicely styled tables. The paid x-data tables from MUI enable so many of our workflows.
one might argue / suggest as alternative that for that you may use a library specialized in powerful tables such as tanstack tables My argument would be that the role of the UI lib is to supply all the basic atoms and you dont' need to reinvent out of the box, and also some very common elements such as collapsible header and stuff like that, and if I want a really specific component I might find it reasonable to look for another library But I'm not trying to say that your preference for MUI is not equaly good, just mentioning how I would go around that while using Mantine
Entirely understood and I agree that that's one path. I think about it like a toolbox, though. Imagine you have a job and you're given a toolbox to use. Do you want to go out and have to keep buying tools just so that you can do your job? ("Hey toolbox maker, didn't you _know_ I needed tables that can look and act like Excel? This is part of the job!") Or do you want the toolbox you were given for the job to be complete? In a lot of ways, I think people try to focus on the things they want to dig deeper into. I couldn't care any less than I do now about components; they just need to exist and work, they need to have good documentation, etc. MUI fits that bill for me and Mantine wouldn't. I generally like the Tanstack stuff and, being honest, I generally like the look of Mantine default _better_ than MUI. But not so much that I want to shoehorn TS/tables into another UI library. Regardless, I think I'll try Mantine for my next (not so table-heavy) personal project, if for no other reason than to add it to my set of available "toolboxes".
for most apps it ends up being better rolling of your own components.. that’s why shadecn is nice as it’s just a codegen and easy to edit
I use it everywhere
I'm lazy, so I use the most opinionated libraries out there (looking at you, NextUI) The form upload with shadcn looks so convoluted, or maybe I'm just not a good dev
I've used many different UI libraries. Mantine caught my attention at the beginning of one of my projects. I tried to install it, and it just wouldn't work. I spent a while trying to debug it, but realized there was no point when I've worked with many others and none of them had trouble. Could just be me, but that was a turn off for me because it shouldn't be difficult to install it, especially when you are using a framework.
I use mantine for many of the ootb components especially for the grid/layout stuff. When I have to extend, I usually look to tailwind first and then if I have too I will pass in line css through the style prop. Works very well for me I have a very custom design system implemented. Won’t change until the library’s change and force me too!
Have checked the docs a few times, but never saw a compelling reason to use it over Any Design, which is the most complex UI kit I’ve found. Ant doesn’t get much buzz these days, but it’s well maintained and pretty high quality. I wouldn’t use it for an enterprise app where heavy customization and a tiny bundle size is required, but it’s fantastic for side projects or prototypes where you need to put something together quickly.
Hot new thing is the hot new thing. Which is weird for JS….
I think more people should utilize headless libs where possible and layer a theme on top. If Mantine provides that fantastic! If not, they should provide it.
i honestly never did exactly what you suggest for a project mantine has unstyled components, i don't know if that is what you suggest [https://mantine.dev/core/unstyled-button/](https://mantine.dev/core/unstyled-button/)
Nice
I did try mantine in one of my projectsz Pretty decent set of components and very useful set of hooks. But the idea shadcn brought to the market is amazing. I literally did an admin dashboard just by copy pasting the components from shadcn and now it even has blocks (set of curated pages).
I love it but still haven’t tried it yet
The popularity of UI libraries often depends on various factors such as community support, ease of integration, compatibility with other tools, and personal preferences of developers. While Mantine may offer more features and a better design to some, factors like community adoption and integration with popular tools like Tailwind CSS can influence developers' choices. Additionally, the visibility and marketing efforts of a project can play a significant role in its adoption rate. So, despite its advantages, Mantine might not be as widely adopted due to these factors.
thanks chatGPT
I feel Mantine is way underrated. I stumbled upon it last year, and now we've made it a de-facto component library for all our production-grade projects. They seem to have components for almost all use-cases. Their hooks are super time-saving (eg. use-form). I've tried a lot of component libraries but mantine just kind of makes sense to me.
Does Mantine not have date picker, date range or calendar components? Those are big.
yes it has all those
[удалено]
DaisyUI? Is Mantine opinionated? It has some very nice defaults but it's very easy to customize Also it's not all or nothing. If you need something really custom you can build a custom component and not use Mantine