DEV Community

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

Posted on • Updated on

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

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

Top comments (14)

Collapse
 
miketalbot profile image
Mike Talbot ⭐

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.

Collapse
 
lemraus profile image
Armel Chausse

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?

Collapse
 
cnsr profile image
Yaroslav

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.

Collapse
 
paulendurrr profile image
Paul

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!

Collapse
 
marveluck profile image
Mateusz Leciejewski

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!

Collapse
 
paulendurrr profile image
Paul

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!

Collapse
 
lovetronics888 profile image
lovetronics888

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

Collapse
 
pau1phi11ips profile image
Paul Phillips • Edited

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

Collapse
 
cnpandya profile image
Chirag Pandya

can u send official link of Bootstrap 5 ?

Collapse
 
pau1phi11ips profile image
Paul Phillips • Edited

v5.getbootstrap.com/ it's still in Alpha release

Collapse
 
sm0ke profile image
Sm0ke

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

Collapse
 
jwp profile image
John Peters

That's beautiful!

Collapse
 
spiritupbro profile image
spiritupbro

man that was fast

Collapse
 
amirdarx profile image
amir

awesome things , Tnx for sharing