If you haven’t heard about Bootstrap, start by reading our Boostrap 101 post or visit the Bootstrap website. If you want to see what can be done with Bootstrap, visit these sites: Bootstrap Expo and Built with Bootstrap.
If you are already familiar with Bootstrap you may know that there are numerous resources out there to help you save time on your web project. But even if you know of what’s out there, here’s a list of some more handy plugins, snippets and other resources to add to your growing list!
I’ve broken these resources down into individual topics.
Bootstrap Templates and Themes
- Bootswatch – Free themes for Bootstrap, just download the CSS file you want and replace it in Bootstrap.
- Designmodo – Bootstrap user interface frameworks and themes. You will get PSD (Photoshop) files with several folders, inside there are specific elements you can drag and customize to incorporate into your own design.
- Creative Market – Offers beautiful and affordable themes (includes some free themes also!)
- WrapBootstrap.com – Everything on this site is for Bootstrap, and the Themes and Templates section is pretty extensive.
- StartBootstrap.com – Great resource for free Bootstrap templates and themes. “Forever free, open source, and easy to use.”
- GetBootstrap.com – Examples – The free example templates on the official Bootstrap site are great for basic templates to build from.
- PaintStrap – Create Bootstrap themes based on different color schemes (uses Adobe Kuler and COLOURlovers color schemes). Input the color scheme (theme or palette ID) and it gives you the CSS. You can also play around with different colors and test how the colors go together.
- LayoutIt! – Drag and drop interface builder, supports Bootstrap 2 and 3.
- Jetstrap – One of the most commonly used Bootstrap editors, starts at $16/month.
- Bootply – A handy Bootstrap editor that helps you customize your web project by pre-populating certain elements. You can see what your customizations look like and copy the code.
Grid Builder – A bootstrap grid builder that allows you to play with positioning of different elements on your page and to test how content is laid out on different devices, and then you just copy the HTML. Bootstrap is built using a “responsive, mobile first fluid grid system that scales up to 12 columns as the device or viewport size increases”.
Content Delivery Network
- Bootstrap CDN WordPress Plugin – Use this plugin to scan your WordPress website and rewrite all Bootstrap files to CDN hosted links.
Other Useful Resources
- Table Strap – Basic Bootstrap table generator, input some options and get your HTML!
- Social Buttons – Elegant social media buttons for Bootstrap 3 using Font Awesome. Supports 24 social media networks.
- Date and Time Picker – Get the code for an existing demo time & date picker, so you can copy/paste and style.
- Bootstrap Accessibility Plugin – From PayPal developers, this is an extension of Bootstrap that makes “many of Bootstrap’s components accessible for keyboard and screen readers’ users.”
- Bootsnip – A repository of different elements and snippets for Bootstrap.
Here are some specifically useful elements from Bootsnipp for you to bookmark:
What are some of the resources you use and recommend? Please let us know!