Brand guidelines
Documentation and examples for Bootstrap’s logo and brand usage guidelines.
License FAQs
Commonly asked questions about Bootstrap’s open source license.
Bootstrap is released under the MIT license and is copyright 2025. Boiled down to smaller chunks, it can be described with the following conditions.
diff --git a/docs/5.3/about/overview/index.html b/docs/5.3/about/overview/index.html index fe04795596..0c4c416f6e 100644 --- a/docs/5.3/about/overview/index.html +++ b/docs/5.3/about/overview/index.html @@ -16,7 +16,7 @@ Light DarkAbout Bootstrap
Learn more about the team maintaining Bootstrap, how and why the project started, and how to get involved.
Team
An overview of the founding team and core contributors to Bootstrap.
Bootstrap is maintained by the founding team and a small group of invaluable core contributors, with the massive support and involvement of our community.
diff --git a/docs/5.3/about/translations/index.html b/docs/5.3/about/translations/index.html index 3a06a25d71..f7cf5a27a3 100644 --- a/docs/5.3/about/translations/index.html +++ b/docs/5.3/about/translations/index.html @@ -16,7 +16,7 @@ Light DarkTranslations
Links to community-translated Bootstrap documentation sites.
Community members have translated Bootstrap’s documentation into various languages. None are officially supported and they may not always be up-to-date.
diff --git a/docs/5.3/components/accordion/index.html b/docs/5.3/components/accordion/index.html index 3d601191ef..b01de5efc0 100644 --- a/docs/5.3/components/accordion/index.html +++ b/docs/5.3/components/accordion/index.html @@ -16,7 +16,7 @@ Light DarkAccordion
Build vertically collapsing accordions in combination with our Collapse JavaScript plugin.
Alerts
Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages.
Badges
Documentation and examples for badges, our small count and labeling component.
Breadcrumb
Indicate the current page’s location within a navigational hierarchy that automatically adds separators via CSS.
Button group
Group a series of buttons together on a single line or stack them in a vertical column.
Buttons
Use Bootstrap’s custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.
Cards
Bootstrap’s cards provide a flexible and extensible content container with multiple variants and options.
Carousel
A slideshow component for cycling through elements—images or slides of text—like a carousel.
Close button
A generic close button for dismissing content like modals and alerts.
Collapse
Toggle the visibility of content across your project with a few classes and our JavaScript plugins.
Dropdowns
Toggle contextual overlays for displaying lists of links and more with the Bootstrap dropdown plugin.
List group
List groups are a flexible and powerful component for displaying a series of content. Modify and extend them to support just about any content within.
Modal
Use Bootstrap’s JavaScript modal plugin to add dialogs to your site for lightboxes, user notifications, or completely custom content.
Navbar
Documentation and examples for Bootstrap’s powerful, responsive navigation header, the navbar. Includes support for branding, navigation, and more, including support for our collapse plugin.
Navs and tabs
Documentation and examples for how to use Bootstrap’s included navigation components.
Offcanvas
Build hidden sidebars into your project for navigation, shopping carts, and more with a few classes and our JavaScript plugin.
Pagination
Documentation and examples for showing pagination to indicate a series of related content exists across multiple pages.
Placeholders
Use loading placeholders (skeleton loaders) for your components or pages to indicate something may still be loading.
Popovers
Documentation and examples for adding Bootstrap popovers, like those found in iOS, to any element on your site.
Progress
Documentation and examples for using Bootstrap custom progress bars featuring support for stacked bars, animated backgrounds, and text labels.
Scrollspy
Automatically update Bootstrap navigation or list group components based on scroll position to indicate which link is currently active in the viewport.
Spinners
Indicate the loading state of a component or page with Bootstrap spinners, built entirely with HTML, CSS, and no JavaScript.
Toasts
Push notifications to your visitors with a toast, a lightweight and easily customizable alert message.
Tooltips
Documentation and examples for adding custom Bootstrap tooltips with CSS and JavaScript using CSS3 for animations and data-bs-attributes for local title storage.
Figures
Documentation and examples for displaying related images and text with the figure component in Bootstrap.
Images
Documentation and examples for opting images into responsive behavior (so they never become wider than their parent) and add lightweight styles to them—all via classes.
Reboot
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.
Tables
Documentation and examples for opt-in styling of tables (given their prevalent use in JavaScript plugins) with Bootstrap.
Typography
Documentation and examples for Bootstrap typography, including global settings, headings, body text, lists, and more.
Color modes
Bootstrap now supports color modes, or themes, as of v5.3.0. Explore our default light color mode and the new dark mode, or create your own using our styles as your template.
Color
Bootstrap is supported by an extensive color system that themes our styles and components. This enables more comprehensive customization and extension for any project.
Components
Learn how and why we build nearly all our components responsively and with base and modifier classes.
CSS variables
Use Bootstrap’s CSS custom properties for fast and forward-looking design and development.
Optimize
Keep your projects lean, responsive, and maintainable so you can deliver the best experience and focus on more important jobs.
Options
Quickly customize Bootstrap with built-in variables to easily toggle global CSS preferences for controlling style and behavior.
Customize Bootstrap with our built-in custom variables file and easily toggle global CSS preferences with new $enable-*
Sass variables. Override a variable’s value and recompile with npm run test
as needed.
Customize
Learn how to theme, customize, and extend Bootstrap with Sass, a boatload of global options, an expansive color system, and more.
Sass
Utilize our source Sass files to take advantage of variables, maps, mixins, and functions to help you build faster and customize your project.
Docs reference
Examples of Bootstrap’s documentation-specific components and styles.
Approach
Learn about the guiding principles, strategies, and techniques used to build and maintain Bootstrap so you can more easily customize and extend it yourself.
While the getting started pages provide an introductory tour of the project and what it offers, this document focuses on why we do the things we do in Bootstrap. It explains our philosophy to building on the web so that others can learn from us, contribute with us, and help us improve.
diff --git a/docs/5.3/extend/icons/index.html b/docs/5.3/extend/icons/index.html index 266214d11c..393be51ebf 100644 --- a/docs/5.3/extend/icons/index.html +++ b/docs/5.3/extend/icons/index.html @@ -16,7 +16,7 @@ Light DarkIcons
Guidance and suggestions for using external icon libraries with Bootstrap.
While Bootstrap doesn’t include an icon set by default, we do have our own comprehensive icon library called Bootstrap Icons. Feel free to use them or any other icon set in your project. We’ve included details for Bootstrap Icons and other preferred icon sets below.
diff --git a/docs/5.3/forms/checks-radios/index.html b/docs/5.3/forms/checks-radios/index.html index efac2e9fb6..6d758b1474 100644 --- a/docs/5.3/forms/checks-radios/index.html +++ b/docs/5.3/forms/checks-radios/index.html @@ -16,7 +16,7 @@ Light DarkChecks and radios
Create consistent cross-browser and cross-device checkboxes and radios with our completely rewritten checks component.
Floating labels
Create beautifully simple form labels that float over your input fields.
Form controls
Give textual form controls like <input>
s and <textarea>
s an upgrade with custom styles, sizing, focus states, and more.
Input group
Easily extend form controls by adding text, buttons, or button groups on either side of textual inputs, custom selects, and custom file inputs.
Layout
Give your forms some structure—from inline to horizontal to custom grid implementations—with our form layout options.
Forms
Examples and usage guidelines for form control styles, layout options, and custom components for creating a wide variety of forms.
Range
Use our custom range inputs for consistent cross-browser styling and built-in customization.
Select
Customize the native <select>
s with custom CSS that changes the element’s initial appearance.
Validation
Provide valuable, actionable feedback to your users with HTML5 form validation, via browser default behaviors or custom styles and JavaScript.
Accessibility
A brief overview of Bootstrap’s features and limitations for the creation of accessible content.
Best practices
Learn about some of the best practices we’ve gathered from years of working on and using Bootstrap.
We’ve designed and developed Bootstrap to work in a number of environments. Here are some of the best practices we’ve gathered from years of working on and using it ourselves.
diff --git a/docs/5.3/getting-started/browsers-devices/index.html b/docs/5.3/getting-started/browsers-devices/index.html index b26c822a6c..a38838900e 100644 --- a/docs/5.3/getting-started/browsers-devices/index.html +++ b/docs/5.3/getting-started/browsers-devices/index.html @@ -16,7 +16,7 @@ Light DarkBrowsers and devices
Learn about the browsers and devices, from modern to old, that are supported by Bootstrap, including known quirks and bugs for each.
Contents
Discover what’s included in Bootstrap, including our compiled and source code flavors.
Contribute
Help develop Bootstrap with our documentation build scripts and tests.
Download
Download Bootstrap to get the compiled CSS and JavaScript, source code, or include it with your favorite package managers like npm, RubyGems, and more.
Get started with Bootstrap
Bootstrap is a powerful, feature-packed frontend toolkit. Build anything—from prototype to production—in minutes.
JavaScript
Bring Bootstrap to life with our optional JavaScript plugins. Learn about each plugin, our data and programmatic API options, and more.
Bootstrap and Parcel
The official guide for how to include and bundle Bootstrap’s CSS and JavaScript in your project using Parcel.
RFS
Bootstrap’s resizing engine responsively scales common CSS properties to better utilize available space across viewports and devices.
RTL
Learn how to enable support for right-to-left text in Bootstrap across our layout, components, and utilities.
Bootstrap and Vite
The official guide for how to include and bundle Bootstrap’s CSS and JavaScript in your project using Vite.
Bootstrap and Webpack
The official guide for how to include and bundle Bootstrap’s CSS and JavaScript in your project using Webpack.
Clearfix
Quickly and easily clear floated content within a container by adding a clearfix utility.
Easily clear float
s by adding .clearfix
to the parent element. Can also be used as a mixin.
Color and background
Set a background color with contrasting foreground color.
Colored links
Colored links with hover states
Focus ring
Utility classes that allows you to add and modify custom focus ring styles to elements and components.
Icon link
Quickly create stylized hyperlinks with Bootstrap Icons or other icons.
Position
Use these helpers for quickly configuring the position of an element.
Ratios
Use generated pseudo elements to make an element maintain the aspect ratio of your choosing. Perfect for responsively handling video or slideshow embeds based on the width of the parent.
Stacks
Shorthand helpers that build on top of our flexbox utilities to make component layout faster and easier than ever.
Stretched link
Make any HTML element or Bootstrap component clickable by “stretching” a nested link via CSS.
Add .stretched-link
to a link to make its containing block clickable via a ::after
pseudo element. In most cases, this means that an element with position: relative;
that contains a link with the .stretched-link
class is clickable. Please note given how CSS position
works, .stretched-link
cannot be mixed with most table elements.
Text truncation
Truncate long strings of text with an ellipsis.
For longer content, you can add a .text-truncate
class to truncate the text with an ellipsis. Requires display: inline-block
or display: block
.
Vertical rule
Use the custom vertical rule helper to create vertical dividers like the <hr>
element.
Visually hidden
Use these helpers to visually hide elements but keep them accessible to assistive technologies.
Visually hide an element while still allowing it to be exposed to assistive technologies (such as screen readers) with .visually-hidden
. Use .visually-hidden-focusable
to visually hide an element by default, but to display it when it’s focused (e.g. by a keyboard-only user). .visually-hidden-focusable
can also be applied to a container–thanks to :focus-within
, the container will be displayed when any child element of the container receives focus.
Breakpoints
Breakpoints are customizable widths that determine how your responsive layout behaves across device or viewport sizes in Bootstrap.
Columns
Learn how to modify columns with a handful of options for alignment, ordering, and offsetting thanks to our flexbox grid system. Plus, see how to use column classes to manage widths of non-grid elements.
Containers
Containers are a fundamental building block of Bootstrap that contain, pad, and align your content within a given device or viewport.
CSS Grid
Learn how to enable, use, and customize our alternate layout system built on CSS Grid with examples and code snippets.
Grid system
Use our powerful mobile-first flexbox grid to build layouts of all shapes and sizes thanks to a twelve column system, six default responsive tiers, Sass variables and mixins, and dozens of predefined classes.
Gutters
Gutters are the padding between your columns, used to responsively space and align content in the Bootstrap grid system.
Utilities for layout
For faster mobile-friendly and responsive development, Bootstrap includes dozens of utility classes for showing, hiding, aligning, and spacing content.
Z-index
While not a part of Bootstrap’s grid system, z-indexes play an important part in how our components overlay and interact with one another.
Several Bootstrap components utilize z-index
, the CSS property that helps control layout by providing a third axis to arrange content. We utilize a default z-index scale in Bootstrap that’s been designed to properly layer navigation, tooltips and popovers, modals, and more.
Migrating to v5
Track and review changes to the Bootstrap source files, documentation, and components to help you migrate from v4 to v5.