Skip to main content Skip to docs navigation

Install Bootstrap

Add Bootstrap to your project with CDN, package manager, or source files.

Install

Pull in Bootstrap’s source files into nearly any project with some of the most popular package managers. No matter the package manager, Bootstrap will require a Sass compiler and Autoprefixer for a setup that matches our official compiled versions.

Package managed installs don't include documentation or our full build scripts. You can also use any demo from our Examples repo to quickly jumpstart Bootstrap projects.

npm install bootstrap
pnpm add bootstrap
yarn add bootstrap
bun add bootstrap

The Bootstrap npm package is published to npm‘s registry, which pnpm, Yarn, and Bun use.

Get started with Bootstrap via npm with our starter project! Head to the Sass & JS example template repository to see how to build and customize Bootstrap in your own npm project. Includes Sass compiler, Autoprefixer, Stylelint, PurgeCSS, and Bootstrap Icons.

Using npm

Using const bootstrap = require('bootstrap') or import bootstrap from 'bootstrap' will load all of Bootstrap’s plugins onto a bootstrap object. The bootstrap module itself exports all of our plugins. You can manually load Bootstrap’s plugins individually by loading the /js/dist/*.js files under the package’s top-level directory.

Bootstrap’s package.json contains some additional metadata under the following keys:

  • sass - path to Bootstrap’s main Sass source file
  • style - path to Bootstrap’s non-minified CSS that’s been compiled using the default settings (no customization)

Using Yarn

Yarn 2+ (aka Yarn Berry) doesn’t support the node_modules directory by default, so our Sass & JS example needs some adjustments:

Shell
yarn config set nodeLinker node-modules # Use the node_modules linker
touch yarn.lock # Create an empty yarn.lock file
yarn install # Install the dependencies
yarn start # Start the project

More packages

Other package-managed installs are available as well for Bootstrap as well.

gem 'bootstrap', '~> 5.3.8'
composer require twbs/bootstrap:5.3.8
Install-Package bootstrap # Default
Install-Package bootstrap.sass # Sass version

Using RubyGems

We recommend installing Bootstrap in your Ruby apps using Bundler, but you can also use RubyGems. See the gem’s README for further details.

Shell
gem install bootstrap -v 5.3.8

Using NuGet

If you develop in .NET Framework, you can also install and manage Bootstrap’s CSS or Sass and JavaScript using NuGet. Newer projects should use libman or another method as NuGet is designed for compiled code, not frontend assets.

CDN

Include Bootstrap’s CSS and JavaScript files via CDN. CDNs (Content Delivery Networks) are services that provides copies of libraries for your website. Instead of installing Bootstrap via a package manager, you link to CDN-hosted files in your website.

Here are our primary CDN links for CSS and JavaScript:

HTML
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-N0uF9hqZ8qhqibHeG7LIFuGvat9Se79BGu0Q/BGYKKgeu8FQd8zVih3hdD2RgaKt" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js" integrity="sha384-ilcRHUqiqfQ8he/Z33RWUckID8qJcGSlQV+xPa0F5TdNjdyBM7Zt/D6iR6rUoaKV" crossorigin="anonymous"></script>

If you’re using our compiled JavaScript and prefer to include Floating UI separately, add Popper before our JS, via a CDN preferably.

HTML
<script src="https://cdn.jsdelivr.net/npm/@floating-ui/dom@1.7.0/dist/floating-ui.dom.umd.min.js" integrity="sha384-R7p1RqabZNhI+RdPNIzTouzd/LBVorZ0Tn3ApcogSOk+HF3o+P0HIenrUw/n0MOj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.min.js" integrity="sha384-CQ4AxjKMbwkpRAbM9OieSp9qUK/cnkDorVLUIayOFJXw/GJHmxbmu1eG0ZeSQ55u" crossorigin="anonymous"></script>

Using CDNs

You can also use the CDN to fetch any of our additional builds.

When using CDN links, be sure to use the integrity attribute to verify the correct files and versions. These hashes are unique to each file and version of Bootstrap, so when you update to a new version, be sure the integrity attribute is also updated.

We also include a crossorigin="anonymous" attribute to prevent CORS errors.

Alternative CDNs

We recommend jsDelivr and use it ourselves in our documentation. However, in some cases—like in some specific countries or environments—you may need to use other CDN providers like cdnjs or unpkg.

You’ll find the same files on these CDN providers, albeit with different URLs. With cdnjs, you can use this direct Bootstrap package link to copy and paste ready-to-use HTML snippets for each dist file from any version of Bootstrap.

Security warning — If the SRI hashes differ for a given file, you shouldn’t use the files from that CDN, because it means that the file was modified by someone else.

Note that you should compare same length hashes, e.g. sha384 with sha384, otherwise it’s expected for them to be different. As such, you can use an online tool like SRI Hash Generator to make sure that the hashes are the same for a given file. Alternatively, assuming you have OpenSSL installed, you can achieve the same from the CLI, for example:

Shell
openssl dgst -sha384 -binary bootstrap.min.js | openssl base64 -A

Download

You can also do the old fashioned thing and download Bootstrap manually. Choose between compiled dist (distribution) files or source files. The latter requires some additional tooling to compiled and use Bootstrap in your project.

TypeDescriptionLink
Distribution filesReady-to-use compiled and minified CSS and JavaScript files. Doesn't include documentation, source files, or dependencies like Popper.Download
Source filesSass, JavaScript, and documentation files for compiling with your own asset pipeline. Requires Sass compiler, Autoprefixer, and a JavaScript bundler like Rollup or Webpack.Download

Should you require our full set of build tools, they are included for developing Bootstrap and its docs, but they’re likely unsuitable for your own purposes.