Using a theme is as easy as downloading a CSS file and replacing the one that comes with Bootstrap.
To modify a theme or create your own, follow the steps below in your terminal. You'll need to have Git and Node installed.
git clone https://github.com/thomaspark/bootswatch.git
npm install
Edit variables.less
and bootswatch.less
in one of the theme directories, or create your own in /custom
.
Type grunt swatch:[theme]
to build the CSS for a theme, e.g., grunt swatch:amelia
for Amelia. Or type grunt swatch
to build them all at once.
Here are additional tips for customizing Bootstrap.
You can use the API to integrate the themes with your platform. Send your request to:
This returns the version
and a themes
array with the following properties: name
, description
, preview
, thumbnail
, css
, cssMin
, cssCdn
, less
, and lessVariables
.
Here's a demo with mustache.js templating.
Drag Bootswatchlet into your bookmarks bar, and use it on Bootstrap-based sites to see how they'd look with a theme.
Use GlyphSearch to find the icons you need from Glyphicons, Font Awesome, and other popular icon font libraries.