mdb-angular-ui-kit

Bootstrap 5 & Angular 18 UI KIT - 700+ components, MIT license, simple installation.

MDB is a collection of free Bootstrap templates, themes, design tools & resources.

---

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 5 & Angular 18

Created by

Trusted by 2 000 000+ developers & designers. Used by companies & institutions like

700+ UI components Super simple, 1 minute installation Detailed docs & practical examples Lots of tutorials Huge and active community MIT license - free for personal & commercial use

---

Bootstrap 5 tutorial

>> Learn more about Bootstrap 5

>> Bootstrap 5 Tutorial

>> Subscribe to our YouTube channel with dozens of Bootstrap tutorials

Start learning from Basics	Learn Bootstrap 5 | Crash Course for Beginners in 1.5H

---

Demo

Simplicity and ease of use are key features of MDB 5 Angular 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.

Spinners

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

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.

Footer

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

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.

Notes

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

---

Extended documentation

• Bootstrap Angular Code Blocks
• Bootstrap Angular Gallery
• Bootstrap Angular Hamburger Menu
• Bootstrap Angular Jumbotron
• Bootstrap Angular Maps
• Bootstrap Angular Media Object
• Bootstrap Angular Mega Menu
• Bootstrap Angular Multiselect
• Bootstrap Angular Social Media Icons & Buttons
• Bootstrap Angular Textarea
• Bootstrap Angular Table Search
• Bootstrap Angular Table Scroll
• Bootstrap Angular Table Responsive
• Bootstrap Angular Table Sort
• Bootstrap Angular Panels
• Bootstrap Angular Masonry
• Bootstrap Angular Contact
• Bootstrap Angular Gradients
• Bootstrap Angular Pagination
• Bootstrap Angular Search

Changelog

7.1.0 (18.11.2024)

Fixes and improvements:

• Timepicker
  • Resolved problem with close method being called twice on component close
  • Fixed dark theme styles in inline mode
• Datepicker
  • Added aria-disabled attributes to elements that display disabled dates
  • Fixed aria-label attribute value in the element used to display day value
  • Resolved problem with adding aria-selected attribute to the element that display day value
• Select
  • Fixed disabled options styles in custom theme
  • Resolved problem with opening dropdown on space key press
  • Added aria-label and aria-labelledby attributes to the component
  • Fixed value returned by (deselect) event
• Autocomplete
  • Fixed aria-expended attribute values for opened and closed menu
  • Fixed problem where component menu was opening even when input was disbled
• Transfer
  • Fixed events output for target container
  • Fixed checkboxes styles
• Range - fixed thumb position on component init
• Onboarding - added fix to prevent memory leak after component destroy
• Input mask - fixed a problem with value formatting when pasting all content into input at once
• Vector maps - fixed shadow styles in zoom buttons
• Transfer - fixed dropdown menu alignment
• Dropdown - fixed aria-expended attribute values for opened and closed menu
• Sidenav - fixed problem with focus trap when the last focused element is inside the component content

New features:

• Timepicker
  • Added new showClearBtn input
  • Added new (clear) event that will be fired after using Clear button
• File upload
  • Added svg and webp extensions to the list of allowed file types for default preview
  • Added new datepickerOptions that allow to define options for the date pickers used by the plugin
• Select - added new (search) event that will be fired after using search input
• Datepicker - added new (viewChanged) event that will be fired on component view change
• Progress - added new circular version of the component

---