What's your experience and what do you use?

Today I've decided to set up my UI design system, do a short research on what would be right fit for my use case and once install do a small example.

Checkboxes I wanted to fill:

it's easily compatible with styled-components
have a wide react UI ready to use components library
it's easy to tweak CSS styles of #2 (preferably with styled-components)

I've stumbled upon a lot of react component libraries but only these ones made happy and they left in the last decision steps.

Just use styled-components

This was my first choice I prefer this one over the others, but I don't want to spend time designing my own it will be just a waste of time. I would love to have one but I want to build it over time while I'm working on a project.

Also, I plan to use styled-component to overwrite styles of the below whatever UI libraries I choose from. Meaning that I won't import components from below libraries, instead, I will wrap them around styled component and export that.

Ant.Design

I liked the design of this one clean, simple, beautiful. A lot of components to choose from and the documentation were just amazing with a wide range of examples.

I was ready to go with this one, but then I heard that voice in my mind 🙃 "Search up for style overwrites with styled comp." its a good practice to do that and it can save you some time. Just search for issues for whatever package you might use 😄.

And there was some tricky integration with styled-components that I found and it did not work all of the time for some components from ant.design - so I decided to continue with my search.

Material-UI

Oh, this one ☝️ - it's ok. if I was looking for something like this 3 years back I would choose this one but now I just don't like the look of it. One thing that makes me have look at it once again is that I see a lot of people praise it. Will see - still don't like it 😁.

Reach-UI

I'm using this one in a big project and it works great with styled-components we have e UI/UX senior dev that it's working on our UI library in combination with other react components and it works great. But once again it takes time so setup different components and I don't want to waste time on something that I can have easily (example ant.design)

This one is light and that's one thing that I can't say about the ant.design

There is one interesting library that I found Bit, it will extract component library from some of your projects and you can use it later one. I plan to try this one later on when I have built some of my components libraries.

Conclusion

Not decided yet - I've spent so much time researching and trying examples and can't decide yet.