Cover image for The first UI Kit for Bootstrap 5! Using Material Design 2.0

The first UI Kit for Bootstrap 5! Using Material Design 2.0

marveluck profile image Mateusz Leciejewski Updated on ・1 min read

Bootstrap 5

Bootstrap's first alpha was officially released on June 16, 2020.

Along with the new version of the most popular HTML, CSS, and JS library, there were most anticipated changes released - jQuery was removed & the project switched to plain JavaScript. However, this is only the beginning of changes

You may learn more about the changes implemented into v.5 with this video

MDB 5 alpha

Just a few days after the release of the new Bootstrap version, the first UI Kit for Bootstrap 5 using Material Design 2.0 was released!

What are the key features of the MDB 5 UI Kit? The most important is simplicity and ease of use, and we owe it to:

  • Latest Bootstrap 5 & Material Design 2.0
  • 500+ material UI components
  • Super simple, 1-minute installation
  • Detailed docs & multiple practical examples
  • Lots of tutorials
  • Plenty of free templates
  • Plain javascript (but works also with jQuery)
  • Huge and active community
  • MIT license - free for personal & commercial use

Learn more about Material Design for Bootstrap 5

Get Started & be ahead of everyone

Installation takes only one minute


markdown guide

Could you give me the highlight points about why Bootstrap 5 with MD is worth choosing over other frameworks? I have a feeling I could get some of that from the video you linked but its 85 minutes long and I have a work-induced short attention span :)

Currently I use Material-UI with React for ref.


I think, everyone has there own choice, but the reason I like bootstrap is because of its simplicity. In version 5, every thing is just the upgrade of version 4. And switching is just like doing icing on the cake.


I think, they had come up with satisfied result that, jQuery should be removed, as vanilla JavaScript makes DOM manupilation more easy and efficient. Also in this era, we have angular, react, and many others. But jQuery on top of that makes several developer hate bootstrap. Now many will come back to home ..πŸ˜…πŸ˜…πŸ˜…β™₯️β™₯️


I would definitely come to bootstrap since they are using plain Javascript.i hate jQuery


Hate's a bit of a strong word for jQuery? It revolutionised JavaScript.


From a React developer perspective, the UI framework I had the best success with is Semantic UI React. I tried Material UI React for a while but I found it to be way less intuitive. I used to write style for all of my components in plain CSS or SCSS but I have been way more productive since I stopped reinventing the wheel for each and every button or menu I want to create. I'm wondering what UI framework do you guys use with React?


I've tried Material UI, Semantic UI and ant.design. Out of the three Semantic UI was the most comfortable to work with. Haven't really used bootstrap in React, but for static sites its my go-to.


None of the text entries seem to work on mobile, tried in both Firefox nightly and Chrome on Android.
Hopefully that's just a bug with their demo site and not the kit itself!


Thanks for the report ❀️ We'll check and fix it, but if you can provide more details, it would be easier for us to diagnose the problem :)

However, because this is the alpha version, errors may occur up to the stable version & we really appreciate it when any bug is reported to us!


It looks like focus is pulled away from the text input when you try to tap into it.
This video shows the problem: streamable.com/nlulnl
Happy to provide more info if required!


Thanks for sharing.
Some sample pages (a simple landing page, login) would be nice & useful.