Bootstrap classes

All Bootstrap utilities and content classes are included and recommended for use. Leveraging these classes ensures development and styling consistency, and helps to prevent CSS bloat.



Reboot, a collection of element-specific CSS changes in a single file, kickstart Bootstrap to provide an elegant, consistent, and simple baseline to build upon.


Documentation and examples for displaying inline and multiline blocks of code with Bootstrap.


Documentation and examples for opting images into responsive behaviour (so they never become larger than their parent elements) and add lightweight styles to them—all via classes.


Documentation and examples for displaying related images and text with the figure component in Bootstrap.



Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons, or any other element.


Quickly and easily clear floated content within a container by adding a clearfix utility.

Close icon

Use a generic close icon for dismissing content like modals and alerts.


Convey meaning through colour with a handful of colour utility classes. Includes support for styling links with hover states, too.


Quickly and responsively toggle the display value of components and more with our display utilities. Includes support for some of the more common values, as well as some extras for controlling display when printing.


Create responsive video or slideshow embeds based on the width of the parent by creating an intrinsic ratio that scales on any device.


Quickly manage the layout, alignment, and sizing of grid columns, navigation, components, and more with a full suite of responsive flexbox utilities. For more complex implementations, custom CSS may be necessary.


Toggle floats on any element, across any breakpoint, using our responsive float utilities.

Image replacement

Swap text for background images with the image replacement class.


Use these shorthand utilities for quickly configuring how content overflows an element.


Use these shorthand utilities for quickly configuring the position of an element.

Screen readers

Use screen reader utilities to hide elements on all devices except screen readers.


Add or remove shadows to elements with box-shadow utilities.


Easily make an element as wide or as tall with our width and height utilities.


Bootstrap includes a wide range of shorthand responsive margin and padding utility classes to modify an element’s appearance.

Stretched link

Make any HTML element or Bootstrap component clickable by “stretching” a nested link via CSS.


Documentation and examples for common text utilities to control alignment, wrapping, weight, and more.

Vertical alignment

Easily change the vertical alignment of inline, inline-block, inline-table, and table cell elements.


Control the visibility, without modifying the display, of elements with visibility utilities.