The Bootstrap framework changed the face of the web ever since it’s initial release back in 2011.  Jump forward to 2017 and it’s still the number one choice for front-end developers all over the globe. Bootstraps mobile-first approach has become so well known that even Dreamweaver CC has integrated it into it’s editor. There are so many awesome extensions and resources out there, I sometimes find it hard to keep up with latest and greatest thing to add to my bootstrap workflow. So for this list, I’ve decided to stick to only the free resources available for the popular framework.

 

Get Bootstrap

GetBootstrap

Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.

Bootstrap CDN

Bootstrap CDN

BootstrapCDN is a free and public CDN that uses MaxCDN’s global content delivery network, which makes websites using its service resilient to unexpected surges in web traffic. Additionally you can access the latest version of Font Awesome CDN.

Font Awesome

Font Awesome

Originally made for the Bootstrap framework. Font awesome is now considered one of the best free icon font services out there, with the use of scalable vector icons that can instantly be customized using CSS.

Bootply Bootstrap Playground

Bootply

Bootply is a free Bootstrap editor that also includes Bootstrap snippets, templates and examples using Javascript, CSS, HTML5 and jQuery. Rightfully so, they have dubbed themselves the “Bootstrap Playground”.

Bootstrap Zero

Bootstrap Zero

Bootstrap Zero is a collection of responsive templates that make the most of Bootstrap’s components. The focus is to curate free templates that adhere to best practices and make use of the Bootstrap’s core framework.

Bootswatch

Bootswatch

Free Bootstrap themes that are released under the MIT License and maintained by the community on GitHub. Themes are built for the latest version of Bootstrap.

Bootsnipp

Bootsnipp

Bootsnipp is an element gallery for web designers and web developers, created by Maks Surguy in September 2012. Anybody who is using Bootstrap will find this website essential in their craft.

Gold Bootstrap Theme

Gold Bootstrap

Gold Bootstrap applies the ‘golden ratio’ value to the original Bootstrap Framework.The golden ratio is considered to be the natural blueprint for beauty. It can be seen in seashells, solar systems, ancient architecture, and even throughout the human body.

Bootstrap Tips you may not know

Bootstrap 3 Tips & Tricks

Very useful article coming from scotch.io. Writer Nicholas Cerminara shares his quick tips that has helped him and many others speed up their workflow using the bootstrap 3 framework.

Prepare for Bootstrap 4

In preparation for the upcoming Bootstrap 4 (currently v4.0.0 alpha.7 stage) I have comprised a short list of design & knowledge resources to help kick start your learning curve of the revised framework. If you don’t know much about it, you can read about the main features here from the official bootstrap blog.

Bootstrap 4 Free PSD Template

Bootstrap 4 PSD Template

This precise PSD layout is based on Bootstrap’s 12-column grid, with each element carefully aligned and true to the Bootstrap 4 Alpha release. This PSD also leverages Photoshop’s Character Styles palette and has each type element as a defined style in the character palette.

Bootstrap 4 Cheat Sheet

Bootstrap 4 Cheat Sheet

An interactive cheat sheet for Bootstrap 4, serving as a quick reference. Includes code samples and live preview of elements. This handy tool was created by Alexander Rechsteiner.

Bootstrap 4 Media Queries with Sass

Bootstrap 4 Media Queries with Sass

Bootstrap 4 has moved entirely from pixel based units to relative em/rem based units with the base font-size of 16 pixels. Understanding the grid breakpoints within Bootstrap 4 is quite important before we move on to our Sass files.

One comment

  • Amanda Ayers
    Amanda Ayers
    Reply

    Really awesome list! You may also want to add http://prepbootstrap.com, they have great free themes and templates, the admin themes are just wow.

Leave a Reply

Your email address will not be published. Required fields are marked *
You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>