angular-bootstrap-md

Bootstrap 4 & Angular 11 UI KIT - 700+ components, MIT license, simple installation.

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
angular-bootstrap-md
13.0.05 months ago5 years agoMinified + gzip package size for angular-bootstrap-md in KB

Readme

Bootstrap 4 & Angular 11 UI KIT - 700+ components, MIT license, simple installation.
MDB is a collection of free Bootstrap templates, themes, design tools & resources.

This content is for the previous 4th version of Bootstrap

Newer version is available for Bootstrap 5. We recommend migrating to the latest version of our product

>> Get 700+ material UI components, free hosting, super simple 1 minute installation & much more

---
Get started

>> Get Started in 1 minute

Simple installation via .zip, npm or cdnjs.

>> Install with MDBGO

Free Hosting, WordPress support, custom domains, SSL support, free database, frontend & backend templates, webpack starter included, git repostiory, FTP & jenkins support.

>> Install with MDBGO + e-commerce shop integration

One click setup! MDB GO allows you to create a WordPress page with a single click. Regardless whether you want to create a Travel Blog or an e-commerce shop to sell your product you can easily do that. You can even combine both into single page.

About Material Design for Bootstrap 4 & Angular 11

Created by
Downloads License YouTube Video Views


Trusted by 2 000 000+ developers & designers. Used by companies & institutions like
<tr>
  <td><img width="300" src="https://mdbootstrap.com/img/logo/brands/nasa.png"></td>
  <td><img src="https://mdbootstrap.com/img/logo/brands/nike.png"></td>
  <td><img src="https://mdbootstrap.com/img/logo/brands/amazon.png"></td>
  <td><img src="https://mdbootstrap.com/img/logo/brands/sony.png"></td>
  <td><img src="https://mdbootstrap.com/img/logo/brands/samsung.png">
  <td><img src="https://mdbootstrap.com/img/logo/brands/airbus.png">
  <td><img src="https://mdbootstrap.com/img/logo/brands/yahoo.png">
  <td><img src="https://mdbootstrap.com/img/logo/brands/deloitte.png">
  <td><img src="https://mdbootstrap.com/img/logo/brands/ge.png">
  <td><img src="https://mdbootstrap.com/img/logo/brands/kpmg.png">
  <td><img src="https://mdbootstrap.com/img/logo/brands/unity.png">
  <td><img src="https://mdbootstrap.com/img/logo/brands/ikea.png">
  <td><img src="https://mdbootstrap.com/img/logo/brands/aegon.png">
</tr>
   </tbody>

<tr>
  <td>
      <a href="https://mdbootstrap.com/docs/angular/" alt="Bootstrap 5" rel="dofollow">
      		<img src="https://mdbcdn.b-cdn.net/img/Marketing/products/angular/mdb-free.webp">
      </a>
  </td>
  <td>
    <ul>
    <li><b><a href="https://mdbootstrap.com/docs/angular/">500+ UI components</a></b></li>          
     <li>Super simple, 1 minute installation</li>
     <li>Detailed docs & practical examples</li>
     <li>Lots of tutorials</li>
     <li>Huge and active community</li>
     <li><b>MIT license - free for personal & commercial use</b></li>
    </ul>
  </td>
</tr>
   </tbody>

Bootstrap 5 tutorial
>> Learn more about Bootstrap 5

>> Bootstrap 5 Tutorial
>> Subscribe to our YouTube channel with dozens of Bootstrap tutorials
<tr>
  <td align="center">
     <a href="https://mdbootstrap.com/docs/standard/getting-started/" alt="Bootstrap Tutorials" rel="dofollow">
      		<img src="https://mdbootstrap.com/wp-content/uploads/2020/12/learnmore-1.png">
      </a>
  </td>
  <td>
      <a href="https://mdbootstrap.com/docs/standard/bootstrap-5-tutorial/#section-beginner" alt="Bootstrap 5" rel="dofollow">
      		<img src="https://mdbootstrap.com/wp-content/uploads/2020/12/cover-bootstrap-5-1.png">
      </a>
  </td>
</tr>
 <tr>
    <td align="center">
      <p align="center"><b>Start learning from Basics</b></p>
      <a href="https://mdbootstrap.com/docs/standard/getting-started/" alt="Bootstrap 5" rel="dofollow">
      		<img src="https://mdbootstrap.com/wp-content/uploads/2020/12/Screenshot_26.png">
      </a>
     </td>
    <td align="center">
      <p align="center"><b>Learn Bootstrap 5 | Crash Course for Beginners in 1.5H</b></p>
      <a href="https://mdbootstrap.com/docs/standard/bootstrap-5-tutorial/#section-beginner" alt="Bootstrap 5" rel="dofollow">
      		<img src="https://mdbootstrap.com/wp-content/uploads/2020/12/Screenshot_26.png">
      </a>
     </td>
  </tr>
   </tbody>

Demo

Simplicity and ease of use are key features of MDB 4 Vue UI Kit. You need only one minute to install and run it.

Buttons

Use MDB custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-buttons.gif">


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-social-buttons.png">


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-buttons2.png">


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-buttons-outline.gif">

Spinners

Indicate the loading state of a component or page with MDB spinners, built entirely with HTML, CSS, and no JavaScript.


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-loader.gif">


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-color-spinners.gif">

Cards

A card is a flexible and extensible content container. It includes options for headers and footers, a wide variety of content, contextual background colors, and powerful display options.


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-cards.png">

Footer

A footer is an additional navigation component. It can hold links, buttons, company info, copyrights, forms, and many other elements.


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-footer.png">

Hover

MDB hover effect appears when the user positions the computer cursor over an element without activating it. Hover effects make a website more interactive.


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-hover.gif">


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-hover2.png">

Notes

Notes are small components very helpful in inserting an additional piece of information.


<img src="https://mdbootstrap.com/img/Marketing/campaigns/demo-alerts.png">



Extended documentation