MDB Vue Free

Download the latest version

Download Learn more
MDB Vue Pro

Download the latest version

Download Learn more
Newsletter

Would you like to be notified about next update ?

Subscribe to our newsletter

MDB 5.8.119.08.2019

MDB Vue 5.8.1 comes with several bug fixes and improvements on existing features.


Improved:

  1. Sliding cards are now based on the v-if directive instead of v-show
  2. Treeview Item - entire component is now clickable
  3. Updated SASS/CSS - synchronized with MDB v.4.8.8

Fixed:

  1. Select - an input field is now set to readOnly
  2. Multi Carousel - touch events without the controls

MDB 5.8.005.08.2019

MDB Vue 5.8.0 includes improvements on the form elements' visual consistency, new options for existing components and fix for the v-model bug in DatePicker.


Added:

  1. Treeview - new colorful version
  2. Chat - the message property in the mdbChatMessage now renders strings into HTML content with the v-html directive.
  3. Hamburger menu - custom icons instead of a default toggler
  4. Datatable - new properties for altering default text
  5. Time Picker - new events (@focus, @blur ) and properties such as icon, outline and more.
  6. Date Picker - new events (@focus, @blur ) and properties such as icon, outline and more.
  7. Select - new events (@focus, @blur ) and properties such as icon, outline and more.
  8. Inputs - new events (@focus, @blur ) and properties for inputs with type="number": max, min, step

Improved:

  1. Visual consistency for the form elements
  2. Updated SASS/CSS - synchronized with MDB v.4.8.7

Fixed:

  1. Datepicker - v-model with custom data formats
  2. Carousel - support for touch events

MDB 5.7.022.07.2019

Version 5.7.0 introduces several new components (Timeline, Treeview, Rating and SlidingCard) as well as new functionalities for Dropdown, Lightbox, Datepicker and Stepper


Added:

  1. Timeline - two new components mdb-timeline and mdb-timeline-item allowing you to easily build responsive, adjustable timelines
  2. Card animations - example with animated social buttons and mdb-sliding-card component which nested within mdb-card will slide over its content
  3. Rating - customizable component for rating and leaving feedback
  4. Treeview - new components for displaying hierarchical item list
  5. Multilevel dropdown - property multiLevel is now available for all MDBVue users
  6. Lightbox - captions props and support for touch events such as pinch zoom and double tap
  7. Datepicker - props necessary for validation, such as validation, isValid, invalidFeedback and validFeedback
  8. Stepper - validation preventing user from going to the next step
  9. 30% of unit test coverage

Improved:

  1. Updated SASS/CSS - synchronized with MDB v.4.8.5

Fixed:

  1. Dropdown - form example

MDB 5.6.008.07.2019

Version 5.6.0 comes with two new components (Chat, Shopping Card) and some important fixes including Double Navigation refactor, Navbar toggler update or new Table Editable features.


Added:

  1. Chat components - added Chat, ChatRoom, ChatList, ChatMessage and SmallChat.
  2. Shopping card form

Improved:

  1. Table Editable - added new features according to the reported issue
  2. Double navigation - toggler prop allowing you to disable collapsing
  3. Navbar - fixed mobile view issues
  4. Select - keyboard access
  5. Dropdown toggling bugfix
  6. Updated NavItem component width icon props
  7. Updated SASS/CSS - synchronized with MDB v.4.8.3

MDB 5.5.124.06.2019

Version 5.5.1 introduces new masonry layouts, select animations and improved multilevel megamenu.


Added:

  1. Masonry - new options for images and responsive layouts.
  2. Time Picker - short guide to keyboard navigation.
  3. Date Picker - short guide to keyboard navigation.
  4. Megamenu - clickable multilevel version
  5. Select - has new animations.

Improved:

  1. Modal forms - updated documentation.
  2. Navbar - updated documentation and demo app page.
  3. Advanced demo - updated documentation.

MDB 5.5.010.06.2019

This release introduces new file inputs, cards and improvements on keyboard accessibility.


Added:

  1. File input - customize file input's apperance with new properties: lg sm rounded outline icon floating and many more.
  2. Advanced cards - we introduced new map, calendar and panels cards.
  3. Select - new example with data from API.
  4. Installation - easily add MDBVue to an exsisting project.

Improved:

  1. Time Picker - can now be easily navigated using a keyboard.
  2. Date Picker - can now be easily navigated using a keyboard.
  3. We've redesigned our components to use common functionalities as mixins.
  4. Updated SASS/CSS - synchronized with MDB v.4.8.2

MDB 5.4.127.05.2019

This release introduces several improvements on existing components and documentation - such as a support for @click events in mdb-nav-link and a solution for a perfect_scrollbar issue.


Improved:

  1. Nav item - is now supporting @click events.
  2. Input - v-model works now with an Array data type.
  3. Datatable scroll - Horizontal scroll examples in demo app have been updated.
  4. Carousel - fading animation works now correctly.
  5. We've added postcss-import to the package in order to fix a perfect_scrollbar issue.
  6. Modals Forms - code snippets in the documentation have been checked and updated.
  7. Background image - documentation in the demo app has been improved.
  8. Lightbox - the code has been slightly refactored to improve performance.
  9. Datatable filter - a new page has been added to the demo app presenting this feature.
  10. Updated SASS/CSS - synchronized with MDB v.4.8.1

MDB 5.4.013.05.2019

This release contains new features such as animated captions or material tooltips as well as improvements on previous versions of tabs, radio inputs, waves and many more.


Added:

  1. Animated captions in carousel - animate captions by adding animation="fadeIn" property. All acceptable classes can be found here
  2. New material tooltips are now available for our Pro users
  3. Mega menu - new options, multi level & hoverable
  4. HTML in datatables - new feature allowing to render HTML string in a cell

Improved:

  1. Refreshing data in datatables - add property refresh to display a button triggering data reload from API. For systematically reloading datatable add a reactive property and specify reloading frequency with a time parameter
  2. Inputs - improved checkboxes and radios for v-model compatibility
  3. Tabs component now can contain custom HTML - use our slots named exactly as a value of atext parameter of each link. New feature allows you to customize transitions as well with transition-duration transition-style properties
  4. Media image - add property circle to change shape of the image
  5. Waves in fixed navbar are now fully automatic (no need to add waves-fixed prop)
  6. Navbar SSR compatibility fix
  7. Select - improved for dynamic data changes
  8. Updated SASS/CSS - synchronized with MDB v.4.8.0

MDB 5.3.029.04.2019

In this release we have improved existing features such as filtering data in datatables, as well as introduced new components and options: slim sidenav, toast notifications, outline inputs and many more.


Added:

  1. Slim sidenav - new version of the sidebar is now available
  2. Stretched Link - new feature allowing you to tranform entire element into clickable link
  3. Bootstrap notifications - new component for creating interactive notifications
  4. Input - supports now several new features: outline inputs with validation, character count and animated inputs
  5. Positioning - new mixin for quickly applied margins and paddings
  6. Masonry - new tool for creating layouts

Improved:

  1. Datepicker - is now fully supporting v-model and uses smooth transitions
  2. Datatables - we improved filtering data and introduced default value for undefined columns and rows
  3. Stepper - now supports usage of the v-model inside
  4. Multiselect - save button is now optional
  5. Perfect Scrollbar -is updated and now works correctly for SSR
  6. Updated SASS/CSS - synchronized with MDB v.4.7.7

MDB 5.2.015.04.2019

This release contains new features such as custom validation, preloading script and multi-item carousel components as well as improvements on previous versions of select, inputs, animations and many more.


Added:

  1. Charts - three new charts: mdb-horizontal-bar-chart mdb-bubble-chart mdb-scatter-chart are now available for your data vizualization. We also improved our charts components for better responsiveness.
  2. Preloading script - display one of our spinners while your page is loading and adjust it's apperance according to your needs.
  3. Multi-item carousel - new mdb component provides flexible options for better mobile display.
  4. Perfect scrollbars for tables and images
  5. Inputs - we introcuded custom validation and validation for material inputs.
  6. Text - new features such as .text-break .text-reset .text-decoration-none are now available.
  7. Borders - use one of the following: .rounded-lg .rounded-sm to control border radius.

Improved:

  1. Animations on scroll - v-animateOnScroll directive now offers additional features, enabling users to specify time delay and position on the screen.
  2. Datatables - :display="3" allows to control number of pages visible in the pagination. The new properties - next="" start="" previous="" end="" enable replacing default buttons with a custom text, while arrows property replaces all of them with mdb-icons.
  3. List group horizontal - add horizontal property to your list group in order to display it horizontaly and one of following properties: sm md lg xl to specify breakpoints for more responsive display.
  4. Modal with a scrollbar - add scrollable property and scroll through long contents with a scrollbar.
  5. Both Select and Inputs components work now with v-model directive and have new outline property.
  6. Select is now supporting a reset option.
  7. Dropdown item - received a router-link functionality.
  8. Updated SASS/CSS - synchronized with MDB v.4.7.6

MDB 5.1.201.04.2019

This version contains some crucial updates related to modal transitions, file input reset or dropdown toggler props extension.


Changed syntax:

  1. Modals - v-if directive is now replaced by show property to fix modals open animation.

Improved:

  1. File Input is now able to reset on user demand.
  2. Select - options are now indexed.
  3. Sidenav - new property for styling the component.
  4. Dropdown toggler is able to get all mdb-button props. There is now a possiblity to add icon, enlarge or make a gradient.
  5. Datatables - data is reactive to improve API connections.
  6. Intros Sections - new animation effects together with new scroll effects.
  7. Date picker and Time picker refactor.
  8. All code snippets in documentation are now updated to avoid errors while importing components.
  9. Dependencies update (Vue 2.6.10 included).
  10. Updated SASS/CSS - synchronized with MDB v.4.7.5.

MDB 5.1.104.03.2019

This patch release brings minor improvements to some components' usability and the docs.


Changed syntax:

  1. Popovers and Tooltips - now the components offer a better, shorter and higher-level syntax involving slots - No need to build the markup with explicit CSS classes within! While it stays backward-compatible, the docs swapped for the newer syntax.

Added:

  1. Numeric input - finally, the component's default feel is material; add the basic to have it bootstrappish. In case the task at hand does not require sophisticated numeric input features like limiters or step size, you can even go for a regular <mdb-input type="numeric"/>!
  2. Button - now there is a way to easier style the button text! Instead of using clumsy CSS classes, just pick the color and pass it to the text prop, like so: <mdb-btn color="primary" text="secondary">...

Improved:

  1. The docs got patched to wider apply our new Vue snippet format and stub for the additional features, like Examples tab for buttons.
  2. Updated SASS/CSS - synchronized with MDB v.4.7.3

MDB 5.1.004.02.2019

This Vue package contains a series of new features such as Spinners, Mobile-friendly Carousel, E-commerce or Blog Comopnents and many others.


Added:

  1. Loader / spinner - simple animations that are used to keep visitors entertained while the page is still loading
  2. Input Group - used for collecting data entered by users
  3. Mobile - touch-based interactions with mobile devices
  4. Blog & E-commerce set of components
  5. Sections demonastration page - plenty of predefined sections dedicated for various website
  6. Advanced section demo page
  7. Waves effect - demonstration how to add waves to any element

Improved:

  1. Fixed device viewport scale according to GitHub's #19 issue
  2. Textarea integration with Input component
  3. Tables documentation - added information about fixed headers, columns and filtering
  4. Updated SASS/CSS - synchronized with MDB v.4.7.0

MDB 5.0.021.01.2019

The necessary update including many long-awaited improvements.


Added:

  1. Parallax - a performant implementation of a an interesting visual effect

Improved:

  1. mdbIcon got a long awaited update to FontAwesome 5!
  2. Navbar navigation - generally improved through simplification and new features like
    1. the `newTab` prop for mdbNavItem, and ability to serve both as an outisde link (href="...") and router link (to="..."),
    2. mdbNavbarNav now it gracefully speads items with space around, while props like right and left help to position the children accordingly.
    3. mdbNavbarBrand can finally serve as a router link
    4. etc...
  3. Modals finally got an exended documentation on their Events, Styles, Forms and other valuable Examples & tempaltes
  4. Starting from this update on, MDBVue library will be following the semantic versioning notation, compliant with best Node ecosystem practices.

MDB 4.10.107.01.2019

In this update you can find new Extended Cards or Tabs free. We also added a few impovements to the demo app and fixed Progress bars data range.


Added:

  1. Extended cards - useful for displaying miscellaneous content build of different elements with characteristic shadows, depth and hover effects

Improved:

  1. Tabs - added default version of this component inside the free package
  2. Fixed Progress bars data range
  3. Popover click event fix
  4. Brought order to categories in app's demo pages
  5. Updated modal component prefixes in documentation pages

MDB 4.10.020.12.2018

This Vue package brings improvements of Progress bars, as well as brand new Tabs, Pills or SideNav components. In addition, we took care of input's dynamic value changes and fixed some critical bugs reported by the GitHub users community.


Changed syntax:

  1. Refactor of Progress Bars that significantly simplifies implementation

Added:

  1. Tabs and Pills components - creating simple tabs is now child's play
  2. New SideNav components were born. Thanks to them, the code for side navigation is now much shorter

Improved:

  1. Fixed issue with accessing one modal from another modal's body
  2. Updated Input component - v-model is now available and existing events are improved. All this to enable dynamic value changes regarding to GitHub users issue.
  3. Tab Content transition is now hidden inside component (no need to add it manually)
  4. Updated SASS/CSS - synchronized with MDB v.4.5.16
  5. Updated all components prefixes inside package and documentation pages

MDB 4.9.010.12.2018

This update contains two minor, yet breaking changes.


Changed syntax:

  1. mdbSelect got totally refactor: now, instead of manual labour, it accepts data arrays.
  2. What has been known as Alerts have been turned into Notifications. API reflects this change

Added:

  1. What has been know as Bootstrap Alerts has regained its rightful place among Components section

Improved:

  1. mdbSelect has been refactored, allowing it to take in dynamically generated data arrays & other improvemens
  2. Updated SASS/CSS - synchronized with MDB v.4.5.15

MDB 4.8.212.11.2018

New MDB Vue PRO package contains now mdbvue dependency inside. There will be no need to download it from our gitlab repo anymore.


Fixed:

  1. Time Picker 24 hours format fix
  2. Navbar collapse target search update

Improved:

  1. Updated SASS/CSS - synchronized with MDB v.4.5.13
  2. PRO package installation - mdbvue dependency is now delivered inside zip archive instead of gitlab link
  3. Links update to new syntax
  4. Huge documentation update

MDB 4.8.122.10.2018

MDB Vue 4.8.1 brings huge amount of new components and some important improvements.


Added:

  1. Background Image
  2. Carousel with lightbox
  3. Gallery
  4. Google Maps
  5. Gradients
  6. Hamburger Menu
  7. Iframe
  8. Mega Menu
  9. Modal Templates & Examples
  10. Search
  11. Slider
  12. Streak
  13. Video

Improved:

  1. Updated SASS/CSS - synchronized with MDB v.4.5.12
  2. Added filter option to datatables
  3. Added a possibility of using v-for loop in Select component
  4. Button now emits native 'click' event
  5. Modal hidden event fix
  6. Carousel now accepts `indicatorStyle` and `indicatorClass` props used for more direct control over automatically generated CarouselIndicators looks and feels
  7. Added a possibility of using direction prop for modal animation

MDB 4.8.008.10.2018

This update introduces Alerts and brings many improvements, mainly to Modals API.


Changed syntax:

  1. Accordion component has been rewritten from scratch to host its logic inside
  2. Badge component color is defined entirely through props with no default color imposition

Added:

  1. Alerts

Improved:

  1. Modals got significantly enhanced through event hooks and styles. The docs follow these improvements
  2. ModalHeader and ModalFooter now allow to have their content positioned and colored through props
  3. mdbIcon now exposes to have it color changed from outside, no class attribute necessary

MDB 4.7.024.09.2018

This update brings many improvements in the existing package, some new components and also webpack upgrade to version 4.


Changed syntax:

  1. import 'bootstrap-css-only/css/bootstrap.min.css'; - we changed our dependencies from bootstrap to bootstrap-css-only. We don't use Bootstrap's JavaScript in our package, so there is no need to download it anymore.

Added:

  1. Chat
  2. Notification (Free version)
  3. Auto scrollbar inside SideNav component
  4. Timeline

Improved:

  1. Updated SASS/CSS - synchronized with MDB v.4.5.10
  2. Updated Vue to version 2.5.17
  3. Updated Webpack to version 4.19.1
  4. Removed bootstrap-vue from dependencies
  5. Datatables warning fix
  6. Carousel fade effect

Fixed:

  1. Changed tags with :is attribute inside all components

MDB 4.6.010.09.2018

With this version we updated inputs and added some new methods. Also time picker has been upgraded, data tables got some new functionalities and we expanded our documentation for those components.


Changed syntax:

  1. Datatables data structure
  2. Inputs import name

Added:

  1. Datatables Material Inputs
  2. Table data import from API
  3. Table export to CSV

Improved:

  1. Updated SASS/CSS - synchronized with MDB v.4.5.9
  2. Inputs
  3. Textarea
  4. Autocomplete
  5. Radio button
  6. Checkbox
  7. Time Picker

In the above inputs, we improoved inner logic and gave you new methods to handle inputs state changes.

Fixed:

  1. Navbar scrolling behaviour
  2. Navbar Brand placement
  3. Table cells wrapping adjust
  4. Waves inside inputs

MDB 4.5.120.08.2018

MDB Vue 4.5.1 brings zip packages improvements.

Zip file is now delivered as a pre-configured Vue CLI tooling with our demonstration page and components imported straight from npm or gitlab as a dependency. Thanks to this, it's easy now to update our package without having to manually overwrite files.

Improved:

  1. MDB update to 4.5.8

MDB 4.5.030.07.2018

With this version we updated syntax for carousels, collapse, dropdowns and selects. Everything to make our components more friendly and requiring less code to initiate.


Changed syntax:

  1. Carousels
  2. Collapse
  3. Dropdowns
  4. Navbars (Navbar Brand)
  5. Selects
  6. E-commerce Section (Products v.5)
  7. Testimonials Section

In the above examples, we moved the logic of components (functions, constructors) to their interiors.

Added:

  1. Chips
  2. Form validation
  3. Image Overlays Card
  4. Steppers
  5. DataTable
  6. Table Additional
  7. Table Editable
  8. Table Pagination
  9. Table Responsive
  10. Table Scroll
  11. Table Search
  12. Table Sort

Improved:

  1. MDB update to 4.5.7

MDB 4.4.116.07.2018

This time we improved styles for better compatibility with Bootstrap 4.1.1


Improved:

  1. Updated Bootstrap to 4.1.1 version and added missed mixins
  2. Updated MDB to 4.5.6

MDB 4.4.002.07.2018

With this update we've made MDB Vue even better


Changed syntax:

  1. Blog section v.4
  2. Cascading cards
  3. Classic tabs
  4. Ecommerce components
  5. Footers
  6. Product sections

Added:

  1. Autocomplete
  2. Flipping cards
  3. Forms
  4. Panels
  5. Testimonial cards
  6. Numeric input
  7. Search

Improved:

  1. Updated MDB to 4.5.5

MDB 4.3.004.06.2018

Another huge update comes with new features


We also created MDB Vue Admin Dashboard Free

Added:

  1. Blog section
  2. Contact section
  3. E-commerce section
  4. Features section
  5. Intros section
  6. Magazine
  7. Projects section
  8. Social buttons
  9. Social section
  10. Team section
  11. Testimonials section

Improved:

  1. Integration with Heroku
  2. Col component
  3. Cards

MDB 4.2.007.05.2018

This update has been shipped with a lot of new features known from MDB jQuery


New components:

  1. Charts Pro
  2. Default Bootstrap's Inputs
  3. More variations of Modals
  4. Lightbox
  5. Carousels Pro
  6. Classic Tabs
  7. Double Navigation
  8. Scrollbar
  9. More versions of Buttons
  10. Sticky Content

Improved:

  1. Range input
  2. Inputs
  3. Updated project dependencies

MDB 4.1.003.04.2018

It's just an small update which provides integration with the latest version of MDB


Added:

  1. NPM repository
  2. scss files

Improved:

  1. Updated to Bootstrap 4.0.0 (stable version)
  2. Updated to MDB 4.5.0
  3. Build tools