Material Kit PRO: Premium Bootstrap 4 Material Design UI Kit @ Creative Tim

Premium Bootstrap 4 Material Design UI Kit

Product description

Start Your Development With A Badass Bootstrap 4 UI Kit inspired by Material Design. If you like Google's Material Design, you will love this kit! It features a huge number of components built to fit together and look amazing.

Fully Coded Items

Material Kit PRO features over 1000 individual components, giving you the freedom of choosing and combining. This means that there are thousands of possible combinations. All components can take variations in colour, that you can easily modify using SASS files.

Every item comes in 2 forms: PSD element and HTML/CSS/JS implementation. You will save a lot of time going from prototyping to full-functional code, because all elements are implemented. We wanted the design process to be seamless, so switching from image to the real page is very easy to do.

Layered Components
Every components comes with separate layers organised in folders. Every element has multiple states for colors, styles, hover, focus, that you can easily access and use. All PSD files are easy-to-use and we also offer support for any issue that you may find. You will find it easy to make changes and customise the elements, due to the smart objects used.

View all components here.

Sections

Material Kit comes packed with a large number of sections. Putting together a page has never been easier than matching together sections. From team presentation to pricing options, you can easily customise and built your pages. We have created multiple options for you to put together and customise into pixel perfect pages.. View all sections here.

Example Pages

If you want to get inspiration or just show something directly to your clients, you can jump start your development with our pre-built example pages. From landing pages to e-commerce or blog pages, you will be able to quickly set up the basic structure for your web project. View example pages here.

Header image courtesy of Ticu Razvan Narcis.

Current version 2.1.0 See updates and changelog

We are here to help you!

112 Web Developers commented on this product

Report issue

mislavsutalo 6 months ago

Hi @dragosct, thank you for your answer. Where I can find your inputs that are ready? Do you have some range slider inputs? What if I will buy Material Kit PRO, can I make range slider inputs? Is there any difference in PRO and Demo scripts? Can I give PRO theme to some developer to make functional range slider inputs? Please be patient with me, I am new in this bussines, maybe my questions are funny. :)

dragosct

downloaded

Hi, @mislavsutalo ! Don't worry we are here to help. If you will look here: http://demos.creative-tim.com/material-kit-pro/index.html, and you will search for Sliders you will see our slider examples. For the scripts that are also in PRO version is no difference, the differences are that in PRO you have more scripts and more plugins then demo version. Please tell us if our sliders are exactly what you looking for. Regards, Dragos

6 months ago

richmundofranco 6 months ago

Checkout these awesome fully coded design resources. #bootstrap #webdesign

aguy

downloaded

6 months ago

If you take out the demo tags on the landing page examples it will throw a jquery error. lines 97-101 of material-kit.js reference "materialKitDemo" instead of "materialKit" if (window_width >= 768) { big_image = $('.page-header[data-parallax="true"]'); if (big_image.length != 0) { $(window).on('scroll', materialKitDemo.checkScrollForParallax); }

dragosct

downloaded

Hi, @aguy ! Thank you for using our product. On what tags did you refer, because in landing page we don't have tags? Regards, Dragos

6 months ago

paulo.sampaiopj5

downloaded

6 months ago

How can I change the language of the datetimepicker plugin from my HTML? Is it possible? Or only changing moment.js file?

dragosct

downloaded

Hi, @paulo.sampaiopj5 ! To change the language of datetimepicker you need to add the javascript language file,after the moment library script, then when you initialize the datetimepicker you must put the option: $('#datetimepicker1').datetimepicker({locale:'es'}); . The ' es ' is just for example, there you must put the lnguage. Regards, Dragos

6 months ago

microcosmic

Just for reference: https://eonasdan.github.io/bootstrap-datetimepicker/#using-locales

6 months ago

joeldesignera

downloaded

6 months ago

I can't seem to compile the scss. There seems to be some issue in _utilities.scsss

joeldesignera

downloaded

6 months ago

I am on BSD4 version anyways.

nick.jorens

downloaded

6 months ago

@dragosct I'm a very happy customer, but I can't seem to get the parralax/color-on-scroll working. What file makes this work?

dragosct

downloaded

Hi, @nick.jorens ! Thank you for using our product. Please take the 2.0.2 version and please try to see if it works now, because we moved some functions in this version. Regards, Dragos

6 months ago

gbinu47

downloaded

6 months ago

Hi @dragosct, the date-time picker does not work on a modal. When I add a date field on top of a modal, the calendar shows up, but I can't select dates. The dates keep flickering, and can't change the month either.

microcosmic 6 months ago

Hi gbinu47. It does work (I have used 2.0.2 BS 4). See the video at https://drive.google.com/file/d/1FHj75p8doIe44VCONzZlMhTxt44NGuFM/view I have copied the existing <input type="text" class="form-control datetimepicker" value="10/05/2016"> into the modal body and added only this CSS: .bootstrap-datetimepicker-widget.dropdown-menu.bottom { top: 26px !important; }

dragosct

downloaded

Hi, @microcosmic ! Thank you for your solution and the video. Regards, Dragos

6 months ago

gbinu47

downloaded

Hi, I was not more specific in the last comment - the datetimepicker does not work inside a form tag - Dates keep on flickering, and I can't select dates/hours, or a different month - see attached video: Added existing <input type="text" class="form-control datetimepicker" value="10/05/2016"> into the demo login form, and it doesn't work as intended. https://drive.google.com/file/d/1KynHyDHR49zWvU1dAtm8w4No8ORyRHmE/view?usp=sharing Datetimepicker doesn't work properly inside a form tag. Thank you

6 months ago

microcosmic 6 months ago

Hey @gbinu47 ... you are right. The only solution I can come up with now is the following: use the datetimepicker outside the form, add a hidden input inside the form. With some jQuery you can now add the datetimepicker value to the hidden input inside the form. http://eonasdan.github.io/bootstrap-datetimepicker/Functions/ ... see dp.change

eravillesteve

downloaded

Hello Guys, I'm still experiencing the same issue with the datetimepicker. I cannot select any dates. Any solution about it since? Thanks

5 months ago

« 1 2 3 4 5 6 7 8 9 10 11 12 »

Login with

Material Kit Pro

Material Kit Pro

Premium Bootstrap 4 UI Kit

2,478 Downloads

112 Comments

Premium Support

Lifetime Updates

Release: 2 years ago

Update: 1 month ago

Premium Bootstrap 4 Material Design UI Kit

Product description

Sections

Example Pages

Product certified by: Creative Tim

Get Free Demo

What is in Demo?

What is in PRO Version?

We are here to help you!

112 Web Developers commented on this product

mislavsutalo 6 months ago

dragosct downloaded

6 months ago

richmundofranco 6 months ago

aguy downloaded 6 months ago

dragosct downloaded

6 months ago

paulo.sampaiopj5 downloaded 6 months ago

dragosct downloaded

6 months ago

microcosmic

6 months ago

joeldesignera downloaded 6 months ago

joeldesignera downloaded 6 months ago

nick.jorens downloaded 6 months ago

dragosct downloaded

6 months ago

gbinu47 downloaded 6 months ago

microcosmic 6 months ago

dragosct downloaded

6 months ago

gbinu47 downloaded

6 months ago

microcosmic 6 months ago

eravillesteve downloaded

5 months ago

You have to be logged in to post a comment. Login here.

Sharing is caring!

Why our customers appreciate us

Design Quality

Design Quality

Amazing

Customizability

This is my go-to kit for any base HTML build - the ease of adding extra JS and PHP code to create extra functionality, and the speed of development is insane.

Built with Material Kit Pro

Join our newsletter and receive weekly news!

Creative Tim

Proud of

504,629 accounts

887,829 downloads

124 sponsored events

Help and Support

Latest News

dragosct

downloaded

aguy

downloaded

6 months ago

dragosct

downloaded

paulo.sampaiopj5

downloaded

6 months ago

dragosct

downloaded

joeldesignera

downloaded

6 months ago

joeldesignera

downloaded

6 months ago

nick.jorens

downloaded

6 months ago

dragosct

downloaded

gbinu47

downloaded

6 months ago

dragosct

downloaded

gbinu47

downloaded

eravillesteve

downloaded