Alternatives To Bootswatch
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
Tabler34,251165a day ago16April 04, 201952mitHTML
Tabler is free and open-source HTML Dashboard UI Kit built on Bootstrap
Ngx Admin24,484
7a month ago11July 19, 2017468mitTypeScript
Customizable admin dashboard template based on Angular 10+
Bootswatch14,0881,604157a month ago39September 15, 202237mitJavaScript
Themes for Bootstrap
Selectize.js12,93360010516 days ago7July 12, 201851apache-2.0SCSS
Selectize is the hybrid of a textbox and <select> box. It's jQuery based, and it has autocomplete and native-feeling keyboard navigation; useful for tagging, contact lists, etc.
Coreui Free Bootstrap Admin Template11,5663123 days ago3May 25, 20178mitHTML
Free Bootstrap Admin & Dashboard Template
3 years agoJuly 20, 20142otherHTML
A library of free and open source Bootstrap themes and templates
6 months ago1May 09, 201860apache-2.0HTML
A vintage 1980s DOS inspired Twitter Bootstrap theme
Jquery Ui Bootstrap5,486
45 years agoMarch 15, 201549HTML
A jQuery UI theme based on Twitter Bootstrap
Bootstrap Fileinput5,2581,182353 months ago89August 17, 202214otherJavaScript
An enhanced HTML 5 file input for Bootstrap 5.x/4.x./3.x with file preview, multiple selection, and more features.
Jekyll Theme Chirpy4,138
9 days ago37September 23, 202219mitHTML
A minimal, responsive and feature-rich Jekyll theme for technical writing.
Alternatives To Bootswatch
Select To Compare

Alternative Project Comparisons


A collection of open source themes for Bootstrap
View Bootswatch themes »

Report bug · Request feature · Blog


There are a few different ways you can integrate Bootswatch into your project.

Via Pre-compiled Asset

Download the bootstrap.min.css file associated with a theme and replace Bootstrap's default stylesheet. You must still include Bootstrap's JavaScript file to have functional dropdowns, modals, etc.


You can use the themes via CDN at jsDelivr.

Via Sass Imports

If you're using Sass (SCSS) in your project, you can import the _variables.scss and _bootswatch.scss files for a given theme. This method allows you to override theme variables.

// Your variable overrides go here, e.g.:
// $h1-font-size: 3rem;

@import "~bootswatch/dist/[theme]/variables";
@import "~bootstrap/scss/bootstrap";
@import "~bootswatch/dist/[theme]/bootswatch";

Make sure to import Bootstrap's bootstrap.scss in between _variables.scss and _bootswatch.scss!

Via npm

You can install as a package with the command npm install bootswatch.

React Users (create-react-app, or similar bundler)

Modern JavaScript bundlers (webpack, parcel, rollup) support importing CSS from JS files. This can make it easier to deploy various 1st and 3rd party assets predictably. Note: There are tradeoffs to the following method, research your tooling before deploying to production.

Before continuing, ensure you've run npm install bootswatch in your local project folder. (Use either npm or yarn.)

Add the following import to your top-level index.js (or App.js) file. Add it before any other .css imports.

import "bootswatch/dist/[theme]/bootstrap.min.css";
// TODO: Note: Replace ^[theme]^ (examples: darkly, slate, cosmo, spacelab, and superhero. See for current theme names.)

Here's an example of updated imports in App.js to use "slate" theme (using a create-react-app fresh project.)

import React from 'react';
import logo from './logo.svg';
import 'bootswatch/dist/slate/bootstrap.min.css'; // Added this 💥
import './App.css';

function App() {

Via Ruby Gem

In your Ruby project, you can access the latest version of each theme by adding the following to your Gemfile and running bundle install:

gem "bootswatch", github: "thomaspark/bootswatch"

Each theme directory is then accessible via the path "#{Gem.loaded_specs["bootswatch"].load_paths.first}/[theme]".

Ruby on Rails users can add the following to an initializer (e.g. config/initializers/bootswatch.rb):

Rails.application.config.assets.paths += Gem.loaded_specs["bootswatch"].load_paths

And thus be able to import themes via Sass like so:

@import "[theme]/variables";
@import "~bootstrap/scss/bootstrap";
@import "[theme]/bootswatch";


A simple JSON API is available for integrating your platform with Bootswatch. More info can be found on the Help page.


Bootswatch is open source and you’re welcome to modify the themes.

Each theme consists of two SASS files. _variables.scss, which is included by default in Bootstrap, allows you to customize the settings. _bootswatch.scss introduces more extensive structural changes.

Check out the Help page for more details on building your own theme.


It's through your contributions that Bootswatch will continue to improve. You can contribute in several ways.

Issues: Provide a detailed report of any bugs you encounter and open an issue on GitHub.

Documentation: If you'd like to fix a typo or beef up the docs, you can fork the project, make your changes, and submit a pull request.

Code: Make a fix and submit it as a pull request. When making changes, it's important to keep the CSS and SASS versions in sync. To do this, be sure to edit the SASS source files for the particular theme first, then run the tasks grunt swatch to build the CSS.

Donation: Donations are gratefully accepted via GitHub and PayPal.


Thomas Park


Mark Otto and Jacob Thornton for Bootstrap.

Jenil Gogari for his contributions to the Flatly theme.

James Taylor for cors-lite.

Corey Sewell for SASS conversion.

Copyright and License

Copyright 2014-2021 Thomas Park

Code released under the MIT License.

Popular Bootstrap Projects
Popular Theme Projects
Popular Web User Interface Categories
Related Searches

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.
Css Framework