❤️ Creative Tim Club - Access all our Present & Future Premium Products

Light Bootstrap Dashboard Pro

Light Bootstrap Dashboard Pro

Premium Bootstrap 4 Admin Template

· 4.80/5 (224 Reviews)
Get Free Demo

Premium Bootstrap 4 Admin Template

Product description


Light Bootstrap Dashboard PRO is a Bootstrap 4 Admin Theme designed to look simple and beautiful. Forget about boring dashboards and grab yourself a copy to kickstart new project! It is the easiest way to save time and money for your development.

What it is

Light Bootstrap Dashboard is built over Bootstrap 4 and it comes integrated with a large number of third-party apps redesigned to fit in with the rest of the elements.

If you want to see the basic version of the dashboard, please check out this link.

This product came as a result of users asking for more functionality than the basic version. We developed it based your feedback and apps you are building. It is very powerful tool, that will allow you to build products ranging to admin panels to content managements systems.

What it isn't

The Light Bootstrap Dashboard PRO is not a bloated-up bundle full with stuff you don't need. We actually take pride in the amount the stuff we didn't add to it. You will only find the stuff that you actually use in this product. No 8-levels navigation nobody uses, no irrelevant boxed layout, no drag and drop for cards(seriously, who goes around moving the display of his panel everyday?).

This dashboard is not something that you will grab and maybe use at some point. It is not a boring old tool and it is probably not what you already have in your project. It is the key to developing your next product.

Special thanks

To create this dashboard, we used already existing tools from awesome developers. We want to thank them for creating cool stuff and support them in the future:
We hope you will go great stuff with this tool. We look forward to hearing your thoughts, suggestions and feedback!

Product certified by: Creative Tim
Light Bootstrap Dashboard Pro - Fully Coded and Responsive HTML5
Light Bootstrap Dashboard Pro - Sass Files for Professional Front End Developers
Light Bootstrap Dashboard Pro - Sketch Files for Professional Designers
Light Bootstrap Dashboard Pro - Crafted with Bootstrap - the most popular Front End Framework
Downloads
2,546
Version
2.0.1
Changelog
Updated
6 years ago
Released
8 years ago
Reviews
Handcrafted Elements
120
Customized Plugins
15
Example Pages
4
Premium Support
Documentation
Fully Responsive

Trusted by 2,466,332 developers and these companies

Freelancer

Good for a personal or client web/mobile app.

$39

Startup

Build your startup or client web/mobile app.

$149

Company

Perfect for web/mobile apps or SaaS projects.

$249

*one time payment - no hidden fees, no subscription

Creative Tim Club

Lifetime Access to all our Present & Future Premium Products!

$749 $349

Documentation   
Full Code   
Designer Files   
Use in SaaS   
Projects    1 1 unlimited unlimited
Team Size    1 up to 5 up to 20 up to 20
Tech Support    support support priority support priority support
Free Updates    6 months 12 months 12 months unlimited

Secured Payment by 2Checkout with:

Info: If you are a Registered Company inside the European Union you will be able to add your VAT ID after your Press "Buy Now"

Frequently asked questions

You can use our products to create an application where the end user is charged with a monthly/annually subscription plan (SaaS - Software as a Service).
The Freelancer license is aimed at people who work on their own. It grants you the right to use the purchased product only for one project (either yours or for a client). This license is not compatible with SaaS-based projects.

The Startup license is aimed at smaller teams. It grants you and your team (up to 5 people) the right to use the purchased product only for one project (either yours or for a client). This license is not compatible with SaaS-based projects.

The Company license is aimed at agencies or larger teams. It grants you the right to create other licensed products base on the template that you purchase form us. This license it's compatible with SaaS-based projects.

The Enterprise license is aimed at large companies with multiple projects. It grants you the right to create any kind of software, SaaS, digital products and sell them. For restrictions, please check here

Also, the differences between our 3 types of Licenses is given by the Tech Support / Free Updates availability and Team Size.

More info here.
The differences between the Free and Pro products consists of the number of components, plugins, sections, pages in each.

More info here.
You can upgrade from one license plan to the next one whenever you want simply by paying the cost difference. You only have to send us an email in which you specify the product that you have and the Order ID. We will give you an unique coupon for the upgrade.

More info here.
Yes, of course! You can use the PRO product for an open source project if you add in the Readme file (on github) or in the description of your product that you built the project using “X product from Creative Tim” and a link to the product page.

More info here.
You don't have any restrictions using the Enterprise License; you just cannot create products or businesses that are in direct competition to us using our products:

  • You can’t re-distribute the Item as stock, in a tool or template, or with source files. You can’t do this with an Item either on its own or bundled with other items. You can’t re-distribute or make available the Item as-is or with superficial modifications. For example: You can’t license an item and then make it available as-is on your website for your users to download.

  • You can’t use the Item in any application allowing an end-user to customize a digital or physical product to their specific needs, such as an “on-demand”, “made to order” or “build it yourself” application. You can use the Item in this way only if you purchase a separate License for each final product incorporating the Item that is created using the application. For example: you can't create a website builder.
Depending on the License you purchase, you can use our products to either code a website/web application for you, for a client, or for multiple clients, which will be hosted on one or multiple domains:

  • For example, if you purchased the Freelancer License or Startup License, you can create only one website (for you or a client). Same, if you have multiple subdomains, like "test.yoursite.com" or "dev.yoursite.com", you can use the Freelancer License or Startup License.

  • If you want to create multiple websites, you will need a bigger License (like Company or Enterprise). Same, if you have a complex application like a SaaS and have "client1.yoursite.com" and "client2.yoursite.com" and "clientx.yoursite.com", you will need a multi-domain License like Company or Enterprise.
Depending on the License type you purchased, one or more developers (from your team, for example) can access the product:

  • If you purchased the Freelancer License, only you (one developer) can use the product.

  • If you purchased the Startup License, up to 5 developers (including you) can use the product.

  • If you purchased the Company License, up to 20 developers (including you) can access the product.

  • If you purchased the Enterprise License, you can work with a bigger team - more than 20 developers can access the product.
Here are the steps to give product access to your team members.
It consists of the product technical manuals like getting started, build tools, and it also describes every component with code examples.
It means that you receive access to the entire code for HTML, JS, and SCSS files depending on the different packages of each product.
When you buy our products you have access to our Support Team so you can submit any ticket to us regarding product functionalities and bug fixes (learning and tutorials related requests are not included). You will get responses directly from the product’s creators in 24 hours for regular Support and in a couple of hours for Priority Support (during business days).
Depending on your license type, you have a determined period when you receive product updates that include bug fixes and new features.

More info here.
Please send us an email at [email protected]. We will send you an upgrade coupon for your desired Bundle, and you will only pay the price difference.
Yes, you can. It is available for all Licenses type as long as the support included in the License is still valid.

More info here.

Get Free Demo

Learn more about Light Bootstrap Dashboard Pro in the light demo version. It has features from the full version. We hope you will like this introduction to this product!

What is in Demo? What is in PRO Version?
Elements 16 120
Plugins 4 15
Examples Pages 4 4
Full Coded
Documentation
SASS Files
Designer Files
Premium Support

We are here to help you!

210 Web Developers commented on this product

nblake989
  • downloaded
7 years ago

@alexpaduraru I just noticed that the gemified version of LBDP is available on UiReady. I purchased the full developer license a few months ago for my rails app and integrated myself. I was reviewing the docs for the rails version and it looks much more straightforward to integrate new versions and rev up the gem if available. I was curious if the gem version lags behind the packaged version sold here or if certain features are excluded? It would be great to have 3rd party support in things like Devise and Kaminari. Is there any chance I can get access to the gem to integrate without paying another $59 for the theme? Sorry for so many questions. Feel free to follow up offline and delete this comment if you see it as inappropriate for the comments section. Thanks!

alexpaduraru
  • owner

@nblake989 the Gem that is on our brother website UiReady has all the functionality that the plain HTML/SASS package from our website has. In addition to that, the Gem, has the generators and is integrated with 3rd party gems like Devise, Kaminari etc. We will send you an email with more details about what you need to do to get access to the gem. Best, Alex!
7 years ago

nblake989
  • downloaded
7 years ago

Hey Alex. Do you have a recommendation for a masonry-like, vertical alignment add on that you can recommend to integrate with LBDP? I've developed a new dashboard and a couple of the cards have to use fixed size objects and the bootstrap grid is proving to not allow for the vertical alignment I need to clean up the card presentation. Any input you have is greatly appreciated. Thanks

alexpaduraru
  • owner

@nblake989 we recommend you to create 3 x .col-md-3 inside a .row and inside of each "col" you add all the cards that should be in that col like how we created the examples area here: http://demos.creative-tim.com/paper-kit-pro/presentation.html in this way you simulate the Masonry effect without integrating any libraries. Please let me know if that is working for you. Best, Alex!
7 years ago

nblake989
  • downloaded

That would work nicely, except not all of my tiles are uniform in size and have different widths ranging from .col-md-3 to .col.md-3. Standard bootstrap grid isn't very good at managing this.
7 years ago

nblake989
  • downloaded

That should've said from .col-md-3 to .col-md-9
7 years ago

alexpaduraru
  • owner

@nblake989 I understand the issue of having the bootstrap grid. Sincerely we didn't integrate the Masonry Library in LBD Pro because we didn't want to make the Dashboard "heavy" with too many plugins when it isn't necessary. Can you please add it and then let us know if you have any feedback and we will try to help you find a solution. Best, Alex!
7 years ago

balintfarago
  • downloaded
7 years ago

What slider are you using? I tried jquery slider but it's not draggable on touch screen devices (known bug). I couldn't make it work with the jquery touch punch plugin so I checked your code but didn't find anything referring to this jquery slider so maybe you're using something else?

balintfarago
  • downloaded

Hi @alexpaduraru , thanks for the reply. I finally made it work, but honestly I forgot what was wrong. The touch punch is a must, but the draggable is unnecessary, it should work without it.
7 years ago

alexpaduraru
  • owner

@balintfarago Thank you for using our product and sorry for the late response. We are using jQuery UI Slider -> https://jqueryui.com/slider/#default. You can add the jQuery Touch Punch using this steps: 1. Please replace the jQuery UI that is included inside the archive with this new jQuery UI http://code.jquery.com/ui/1.11.4/jquery-ui.min.js because our jQuery UI doesn't have the "draggable event". 2. Please add the jQuery Touch Punch library after you add the jQuery UI library like how they explain inside the official website: https://github.com/furf/jquery-ui-touch-punch#readme 3. Please call the draggable event for the "ui-sliders" inside assets/js/demo.js on line 566 or anywhere after you initialized the sliders with this "$('.ui-slider-handle').draggable();". In this way, you let the browser know that the handles of the sliders can be dragged. We tested this and everything is working fine. You can test it with your phone here: http://lbd.paperplane.io/examples/forms/extended.html Please let us know if that was working for you. Best, Alex!
7 years ago

kontakt4v8
  • downloaded
7 years ago

Hi! Little help needed. I'm using css to make a masonary like layout but without the needed js. There is a little bit of code for the row to work with the layout, but when using this: -moz-column-width: 18em; -webkit-column-width: 18em; -moz-column-gap: 1em; -webkit-column-gap: 1em; The footer goes wild, shown in the screenshot: http://s33.postimg.org/yptdls68v/Wzory_i_Galeria_Tatua_y_Inspiracje_Tatua_owe_Z.png I can provide more code if needed.

alexpaduraru
  • owner

@kontakt4v8 thank you for using our product. Can you please send us a link to your website or an archive with the current implementation? We couldn't simulate the issue on our end. Keep in touch, Alex!
7 years ago

chipmunkgeek
  • downloaded
7 years ago

Currently integrating LBDPro into my Rails App which is running on Bootstrap 3. I ran into a few issues... not sure if others have encountered the same... 1. light-bootstrap-dashboard.js, at around Line 18, assumes that the platform, if it is not mac, is Windows. But there are also other platforms, like Linux, in which the browser doesn't support perfectScrollbar. For me, in Linux, this raises a JS error. 2. chartist.min.js, at the very end, makes a reference to chartist.min.js.map, which wasn't included in the LBDPro zip. This was raising a 404 i my app. I had to go track down this dependency myself from Chartist and add it to my project.

alexpaduraru
  • owner

@chipmunkgeek thank you for using our product and for the useful feedback. You're right with the platforms, we wanted to make sure that the system that doesn't have "a nice looking" scroll would be replaced by the PerfectScrollbar. We will do more tests on Linux to see if the scrollbar is acting like how it acts on Mac and then we will not activate the perfectScrollbar. If you don't want to work with chartist to change the base code then you can remove that line, it is good just for development purpose, on the production, you don't need the map. We will remove it from the production too. Please let us know if you add the Linux on the list of OSs and perfectScrollbar is not activate if everything is working fine. In the meantime we will check other options. Keep in touch, Alex!
7 years ago

alexpaduraru
  • owner

@chipmunkgeek I understand. I'm glad that you found a quick solution. We will update the switch in the next version for sure. Keep in touch, Alex!
7 years ago

chipmunkgeek
  • downloaded
7 years ago

Just a tip for those trying to integrate LBDP into a Rails app using SASS... Originally, my application.scss had @import 'bootstrap' followed by @import 'light-bootstrap-dashboard'. I soon realized that LBDP had some !default variables (in _variables.scss) that need to be set BEFORE Bootstrap's own default variables are set. But, you can't just @import 'light-bootstrap-dashboard' before @import 'bootstrap', because there are dependency issues. The solution is to explicitly @import 'lbd/variables' FIRST, and then @import 'bootstrap' and @import 'light-bootstrap-dashboard'. That worked for me.

alexpaduraru
  • owner

@chipmunkgeek thank you for using our product and for the solution of the problem. We will do some more tests to see why is that happening because on all our pages, live examples and inside the plain HTML Template we include bootstrap.css followed by light-bootstrap-dashboard.css and everything is working fine. So having the variables from LBD before the Bootstrap's variables it's a little bit weird but we will find the issue. Here is also the Free version of LBD as a Ruby Gem: https://uiready.io/items/light-bootstrap-dashboard-rails-version Please check it and let us know if you have any feedback. Best, Alex!
7 years ago

chipmunkgeek
  • downloaded

@axelut I think this is the difference between using the straight CSS version versus the SASS version. For example, look at the "Single Select" on the Extended Forms page of the dashboard demo. The padding-top for the button is 8px, which is what you have defined in light-bootstrap-dashboard.css at line 4209. This overrides what was defined in bootstrap.min.css, which was originally 6px. So, yes, in straight CSS, you want light-bootstrap-dashboard.css *after* bootstrap.min.css, so that you can do these kinds of overrides. But in SASS, the .btn is given its padding based on the $padding-base-vertical variable, which is defined using !default, meaning "define this unless it is already defined". LBDP wants it to be 8px, while Bootstrap wants it to be 6px. But, in this SASS case with !default - it's "whoever defines it first wins" - so you will want LBDP's declaration *first*, because then the definition can't get overridden by Bootstrap. There's nothing wrong with any of the LBDP code - it's just a matter of making sure that your SASS implementation users know to include LBDP's _variables.scss before Bootstrap's.
7 years ago

alexpaduraru
  • owner

@chipmunkgeek yeeees, now I see what you wanted to say. You're 100% right, when bootstrap is coming as SASS files, then you've got that case because of the defaults. Thank you for the information. We will add this in the documentation in case there are other persons who want to manually integrate it in rails. Keep in touch, Alex!
7 years ago

chipmunkgeek
  • downloaded

@axelut Still having a great experience with LBDP so far. Quick question - I noticed that you've integrated (and modified the styling for) the Switch from Mattia Larentis. It looks like you're working with v1.3 of the switch, but this has since been updated to the official "Bootstrap Switch" now at v3.3.2. Your link to "Larentis Switch" in the LBDP documentation is dead now, and since it's such an old version, it's difficult to know exactly how one might use the v1.3 switch. Are there plans to update LBDP to use the more recent version of Bootstrap Switch?
7 years ago

alexpaduraru
  • owner

@chipmunkgeek thank you for the information. Till now we didn't receive any issues or requests for the Switch so it wasn't on our update list. But if you said they moved to a better version, yes we will update it too. Did you try to integrate it yet?
7 years ago

chipmunkgeek
  • downloaded

@axelut I wanted to change the switch on-color and off-color, and I needed to handle an event when the switch is clicked. This just meant writing some additional JS and some override CSS code. For now, I was able to get what I needed done by doing this. But it does some like there are some huge improvements between v1.3 (April, 2013) and v3.0 (April, 2014). This includes the ability to set some of the above things as options via JS.
7 years ago

kontakt4v8
  • downloaded
7 years ago

Hi, have you tested LBDP on the built in samsung mobile (galaxy s3) browser? I've tested it today, and the menu seems unscrollable. Any way to fix it?

alexpaduraru
  • owner

@kontakt4v8 thank you for using our product and for the feedback. At this moment, we have only Galaxy S6 and S7 as physical devices for testing, we use browserstack.com for more devices (they give us access to physical devices and emulators). We tested and couldn't find the issue. Please check these 2 videos for Chrome and Default Browser (https://sendvid.com/cwc2ie7f and https://sendvid.com/fjojlkw8). We will try to do more tests till we find the bug. We have a scrollbar plugin that is creating a "smooth" scroll and maybe that is the problem. Can you please go to light-bootstrap-dashboard.js and comment the line 19 where we activate the ".perfectScrollbar()" function? Maybe there is a conflict between that library and the browser scroll function. Please let us know the feedback. Best, Alex!
7 years ago

greatbk
  • downloaded
7 years ago

I have a little problem. checkbox always located front of layer. (left side) I wish it moved center of layer.

alexpaduraru
  • owner

@greatbk thank you for using our product. Can you please give us more details about the issue? If you want to send us any images with the look of the checkbox please send an email at hello[at]creative-tim.com and we will assist you there.
7 years ago

kontakt4v8
  • downloaded
7 years ago

Where is the LBDP changelog, and how can I check when the latest update was?

alexpaduraru
  • owner

@kontakt4v8 please go upper in this page where is the "Description" press on view more, then you will see at the end of the description the "change log" link. There are all the details there with the date and what was changed in every version. We will add the change logs in your downloads page on your account so it will be easier to see what is new. Best, Alex!
7 years ago

adrian.voinicu
  • downloaded
7 years ago

Not sure if this has been mentioned before but calc(100% - $sidebar-width) doesn't compile correctly. This should be calc(100% - #{$sidebar-width}).

alexpaduraru
  • owner

@adrian.voinicu thank you for using our product and for pointing out. Can you please give us more details about the SASS compiler that you use? We use Koala and everything was compiled fine. We will make the necessary adjustments if the appears in other compilers. Best, Alex!
7 years ago

adrian.voinicu
  • downloaded

Anonymous Tim, I don't think this is compiler related. It seems to me that it was intended that way, at least judging by this: https://github.com/sass/sass/issues/818 (I know it's an old topic but it still hasn't been closed). Also, do you plan to make this compatible with Bootstrap 4 anytime soon? Thanks!
7 years ago

adrian.voinicu
  • downloaded

@alexut.alex Just rememberd: i found the variable in the compiled CSS.
7 years ago

alexpaduraru
  • owner

@adrian.voinicu thank you for the details on the github issue and sorry for the late response. It's clear that the issue is not closed there but when I check the our official compiled CSS that is in the product archive and on our live demo the .main-panel has the width: calc(100% - 260px); which make me think that everything was working fine with the SASS compiler. Otherwise, the view of the Dashboard would be broken, because that width is crucial for the "Left Sidebar" and "Right Main Panel" alignment. It's weird that you found that in the compiled CSS, we will make some more tests to see why your compiled CSS is different than our compiled CSS. We will encapsulate the variables in calc, in a future update, to make sure everything is working fine in all the use cases of the SASS. We will update the product to BS4 when they will release, at least, a stable Beta Version for production. Best, Alex!
7 years ago

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