10 reasons why I love Material-UI

Material-UI is a UI framework for react based on Material Design which is developed by Google.

I tried material-UI for the first time back in 2020 for one of my projects. From then I have become a fan of it. It is really beautiful and elegant. Material UI has everything that you need for a modern website.

Now, why would you want to use a UI framework instead of custom CSS styling?

The reason might be:

  • You are not good at CSS or you don’t like it.
  • CSS from scratch is too much work.
  • You are in a hurry.
  • You are terrible at design and so on…

Let’s see 10 reasons why you should try material-UI:

  1. Beautiful design: Material-UI is based on Material Design. And It is developed by Google. It is also a well tested design by professionals. And it is so beautiful. If you have visited any kind of google website, you will find a common design.

This is material design. It is clean, colors are good for the eyes, and nice animations.

2. Huge amount of Components: Material-UI has a huge amount of components. It has everything that you need. You can create simple to complex websites easily.

3. CSS in JS: It simply means writing your CSS styles with javascript but with much more flexibility. It gives you unique class names. You can use them for making the styles scoped to the component.

4. Customizable: You can customize Material-UI however you want. You can use custom CSS with makeStyles. Or you can customize the whole theme. You can change every style of any class.

5. Grid System: This is my favorite feature of this framework. You can create a complex responsive layout with Material-UI Grid.

6. Icons: Material-UI comes with over 1000 icons. They are customizable.

7. Tree Shaking: It removes all the unused code from the package for the production build. That’s how websites can load faster.

8. Great Docs: Material-UI docs are one of the best docs I have ever seen. It has everything that you need to know.

9. TypeScript support: Material-UI supports typescript out of the box.

10. Great Community: Material-UI is very popular and it has a large and great community. If you face any problem, the community members will try their best to help you.

So, these are the reasons why I love Material-UI.

That’s it for today.

Shameless Plug

I have made a few project based videos with vanilla HTML, CSS, and JavaScript.

You will learn about:

  • Javascript intersection observer to add cool effects
  • DOM manipulation
  • Aligning elements with CSS positions.
  • How to make responsive websites.

These will be great projects to brush up on your front end skills.

If you are interested you can check the videos.

Please like and subscribe to Cules Coding. It motivates me to create more content like this.

That’s it for this blog. I have tried to explain things simply. If you get stuck, you can ask me questions.

By the way, I am looking for a new opportunity in a company where I can provide great value with my skills. If you are a recruiter, looking for someone skilled in full stack web development and passionate about revolutionizing the world, feel free to contact me. Also, I am open to talking about any freelance project.

See my work from here


Videos might you might want to watch:

Blogs you might want to read:




Full Stack Developer

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Self-inflicted Chaos

Crafting Aha! Moments: Lessons from Live Experience Creators

‘My Footprint’ — a scathing review of the new carbon footprint tracking app from the WWF

A monograph on semi-structured interviews

Top Mobile App Developing Companies And How They Will Succeed

A Usability Study on Self-Improvement and Productivity Apps

Let’s give it the old UX Business Model Canvas trick

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Anjan Shomodder

Anjan Shomodder

Full Stack Developer

More from Medium

Dark and Light Mode — Using React & Tailwind CSS

Creating a Glitching Typing Animation in React

How to use Swiper.js with React.

Create Revealing Text Animation with React & GSAP