Bootstrap Examples

Quickly get a project started with any of our examples ranging from using parts of the framework to custom components and layouts.

Snippets

Common patterns for building sites and apps that build on existing components and utilities with custom CSS and more.

featured image
Section Snippets

Headers

Display your branding, navigation, search, and more with these header components

featured image
Section Snippets

Heroes

Set the stage on your homepage with heroes that feature clear calls to action.

featured image
Section Snippets

Features

Explain the features, benefits, or other details in your marketing content.

featured image
Section Snippets

Sidebars

Common navigation patterns ideal for offcanvas or multi-column layouts.

featured image
Section Snippets

Footers

Finish every page strong with an awesome footer, big or small.

featured image
Section Snippets

Dropdowns

Enhance your dropdowns with filters, icons, custom styles, and more.

featured image
Section Snippets

List groups

Extend list groups with utilities and custom styles for any content.

featured image
Section Snippets

Modals

Transform modals to serve any purpose, from feature tours to dialogs.

featured image
Section Snippets

Badges

Turn your expandable navbar into a sliding offcanvas menu (doesn't use our offcanvas component).

featured image
Section Snippets

Breadcrumbs

Integrate custom icons and create stepper components.

featured image
Section Snippets

Buttons

Create custom buttons for just about any use case with utilities.

featured image
Section Snippets

Jumbotrons

Create modernized versions of the classic Bootstrap component.

Custom Components

Brand new components and templates to help folks quickly get started with Bootstrap and demonstrate best practices for adding onto the framework.

featured image
Section Custom Components

Album example

Simple one-page template for photo galleries, portfolios, and more.

featured image
Section Custom Components

Pricing example

Example pricing page built with Cards and featuring a custom header and footer.

featured image
Section Custom Components

Checkout example

Custom checkout form showing our form components and their validation features.

featured image
Section Custom Components

Product example

Lean product-focused marketing page with extensive grid and image work.

featured image
Section Custom Components

Cover Template

Custom checkout form showing our form components and their validation features.

featured image
Section Custom Components

Carousel Template

Customize the navbar and carousel, then add some new components.

featured image
Section Custom Components

Blog Template

Simple one-page template for photo galleries, portfolios, and more.

featured image
Section Custom Components

Dashboard Template

Basic admin dashboard shell with fixed sidebar and navbar.

featured image
Section Custom Components

Signin Template

Custom form layout and design for a simple sign in form.

featured image
Section Custom Components

Sticky Footer Template

Attach a footer to the bottom of the viewport when page content is short.

featured image
Section Custom Components

Sticky Footer Navbar Template

Attach a footer to the bottom of the viewport with a fixed top navbar.

featured image
Section Custom Components

Jumbotron example

Use utilities to recreate and enhance Bootstrap 4's jumbotron.

Framework

Examples that focus on implementing uses of built-in components provided by Bootstrap.

featured image
Section Framework

Starter Template

Nothing but the basics: compiled CSS and JavaScript.

featured image
Section Framework

Grid Template

Multiple examples of grid layouts with all four tiers, nesting, and more.

featured image
Section Framework

Cheatsheet

Kitchen sink of Bootstrap components.

Navbars

Taking the default navbar component and showing how it can be moved, placed, and extended.

featured image
Section Navbars

Navbar Template

Demonstration of all responsive and container options for the navbar.

featured image
Section Navbars

Offcanvas navbar template

Turn your expandable navbar into a sliding offcanvas menu (doesn't use our offcanvas component).

featured image
Section Navbars

Top navbar example

Single navbar example of a static top navbar along with some additional content.

featured image
Section Navbars

Fixed top navbar example

Single navbar example with a fixed top navbar along with some additional content.

featured image
Section Navbars

Bottom navbar example

Single navbar example with a bottom navbar along with some additional content.

featured image
Section Navbars

Offcanvas navbar template

Turn your expandable navbar into a sliding offcanvas menu (doesn't use our offcanvas component).

Integrations

Integrations with external libraries.

featured image
Section Integrations

Masonry example

Combine the powers of the Bootstrap grid and the Masonry layout.