Bootstrap Blog

Bootstrap 5.3.3

Tue, 20 Feb 2024 15:22:00 +0000

Bootstrap v5.3.3 is here with bug fixes, documentation improvements, and more follow-up enhancements for color modes. Keep reading for the highlights!

Highlights

Fixed a breaking change introduced with color modes where it was required to manually import variables-dark.scss when building Bootstrap with Sass. Now, _variables.scss will automatically import _variables-dark.scss. If you were already importing _variables-dark.scss manually, you should keep doing it as it won’t break anything and will be the way to go in v6.
Fixed a regression in the selector engine that wasn’t able to handle multiple IDs anymore.

Color modes

Badges now use the .text-bg-* text utilities to be certain that the text is always readable (especially when the customized colors are different in light and dark modes).
Fixed our color-modes.js script to handle the case where the OS is set to light mode and the auto color mode is used on the website. If you copied the script from our docs, you should apply this change to your own script.
Fixed color schemes description in the color modes documentation to show that color-scheme() only accept light and dark values as parameters.

Miscellaneous

Allowed <dl>, <dt> and <dd> in the sanitizer.
Dropped evenly items distribution for modal and offcanvas headers.
Fixed the accordion CSS selectors to avoid inheritance issues when nesting accordions.
Fixed the focus box-shadow for the validation stated form controls.
Fixed the focus ring on focused checked buttons.
Fixed the product example mobile navbar toggler.
Changed the RTL processing of carousel control icons.

Docs

Dropped unnecessary right margin for example code blocks.
Fixed emphasis text utilities usage in background utilities examples section.
Added an technical explanation on how to render an accordion expanded by default.
Changed Vite config path import in Vite guide.
Enhanced the card image description of the .card-img-* classes.
Mentioned shift-color() function in the Sass customization page among tint-color() and shade-color().
Added missing type="button" attribute to the Cheatsheet examples navigation buttons.
Updated the colors table in the customization page to be responsive.

Get the release

Head to https://getbootstrap.com for the latest. It’s also been pushed to npm:

Bootstrap 5.3.2

Thu, 14 Sep 2023 14:30:00 +0000

Bootstrap v5.3.2 is here with bug fixes, documentation improvements, and more follow-up enhancements for color modes. Keep reading for the highlights!

Highlights

Passing a percentage unit to the global abs() is deprecated since Dart Sass v1.65.0. It resulted in a deprecation warning when compiling Bootstrap with Dart Sass. This has been fixed internally by changing the values passed to the divide() function. The divide() function has not been fixed itself so that we can keep supporting node-sass cross-compatibility. In v6, this won’t be an issue as we plan to drop support for node-sass.
Using multiple ids in a collapse target wasn’t working anymore and has been fixed.

Color modes

Increased color contrast of form range track background in light and dark modes.
Fixed table state rendering for color modes with a focus on the striped table in dark mode to increase color contrast.
Allow <mark> color customization for color modes.

Docs

Added alternative CDNs section in Getting started -> Download.
Added Discord and Bootstrap subreddit links in README and Getting started -> Introduction:
- Discord maintained by the community
- Bootstrap subreddit

Get the release

Head to https://getbootstrap.com for the latest. It’s also been pushed to npm:

Bootstrap Icons v1.11.0

Tue, 12 Sep 2023 00:01:00 +0000

Bootstrap Icons v1.11.0 has arrived with 100 new icons—including new floppy disk icons, additional brand icons, new person icons, new emojis, some birthday cake, a few new science icons, and more. We’re now at over 2,000 icons!

100 new icons

Here’s a quick look at all the new icons in v1.11.0:

Check out the pull request for all the details on which icons were added and which were updated.

Bootstrap 5.3.1

Wed, 26 Jul 2023 08:05:00 +0000

Bootstrap v5.3.1 is here with bug fixes, documentation improvements, and more follow-up enhancements for color modes. Keep reading for the highlights!

Color modes:
- Increased color contrast for dark mode by replacing $gray-500 with $gray-300 for the body color
- Added our color mode switcher JavaScript to our examples ZIP download
Components:
- Improved disabled styling for all .nav-links, providing .disabled and :disabled for use with anchors and buttons
- Add support for Home and End keys for navigating tabs by keyboard
- Added some basic styling to toggle buttons when no modifier class is present
- Fixed carousel colors in dark mode
Forms:
- Fixed floating label disabled text color
Utilities:
- .text-bg-* utilities now use CSS variables
Sass:
- Add new $navbar-dark-icon-color Sass variable
- Removed duplicate $alert Sass variables
- Added a new variable for $vr-border-width to customize the vertical rule helper width
Documentation:
- Added search to our homepage
- Improved responsive behavior on Dashboard example
- Improved dark mode rendering of Cheatsheet examples

Get the release

Head to https://getbootstrap.com for the latest. It’s also been pushed to npm:

Bootstrap 5.3.0

Tue, 30 May 2023 07:35:00 +0000

It’s official, the final stable release of v5.3.0 has landed! It’s been a monumental effort to revamp our codebase for CSS variables and color modes, one that will see continued changes leading up to an eventual Bootstrap 6. And we’re so excited to finally ship it!

On top of all the work that’s gone into this release, a lot has happened behind the scenes since we shipped our pre-releases. Keep reading to learn everything that’s new in v5.3.0.

Bootstrap 5.3.0-alpha3

Mon, 03 Apr 2023 07:35:00 +0000

Hot on the heels of our second alpha, we’re releasing a third (and unexpected) alpha for v5.3.0 today with some fixes for some Node Sass compilation errors. In addition, we’ve added a handful of other updates. We’re still on target to ship our stable release soon!

Once again, if you’re new to the v5.3.0 alpha releases, please read through the Migration guide for the first alpha and last month’s second alpha.

Here’s a look at what’s changed in this quick release:

Bootstrap 5.3.0-alpha2

Fri, 24 Mar 2023 14:40:00 +0000

Our second alpha release of v5.3.0 has landed with a ton of enhancements and bug fixes for our new color modes! There’s still more to come, but we’ve held off shipping until we ironed out enough issues. Huzzah, we have!

This v5.3.0 release is a monumental update for Bootstrap 5. It’s big enough that it could’ve been a v6 on its own, but we wanted to do right by the community and get color modes out the door without the massive major release upgrade. We’re getting super close now, so bear with us as we continue to chip away at this.

Bootstrap 5.3.0-alpha1

Sat, 24 Dec 2022 08:00:00 +0000

It’s a Christmas miracle—Bootstrap v5.3.0-alpha1 has arrived just in time for the holiday break! This release brings new color mode support, an expanded color palette with variables and utilities, and more.

We’re keeping things short and simple in this blog post with deeper dives into the new color modes and more coming in future posts. For now, we want you to enjoy the holiday break and come back next year feeling refreshed and rejuvenated. Keep reading for what’s new and we’ll see you next year!

Bootstrap 5.2.3

Tue, 22 Nov 2022 08:00:00 +0000

We’ve deviated from developing v5.3.0 to ship a new patch release, Bootstrap v5.2.3, with a handful of more urgent bug fixes.

Highlights

Added the missing :root CSS variables to our utilities bundle
Fixed the deprecation warning with Sass 1.56.0
Fixed the RTL translate() direction for carousels
Fixed tooltip and popover disposal inconsistencies

We’re heading right back to it with v5.3.0 with support for color modes, new utilities, and more. Look for a pre-release of that soon.

Bootstrap Icons v1.10.0

Fri, 11 Nov 2022 00:01:00 +0000

Bootstrap Icons v1.10.0 is here with nearly 150 new icons. This release includes tons of new variants for person, building, and database icons, plus new brands, rockets, road signs, globes, and many more. We’re now at over 1,900 icons!

150 new icons

Here’s a quick look at all the new icons in v1.10.0:

Some highlights for the new icons include:

22 new person icons
26 new house icons
24 new building icons, including a renamed building to buildings
22 new database icons
24 new street sign icons
New globe icons
New EV, taxi, bus, and scooter transportation icons
New rockets
and more!

We also fixed the fill rules for several some issues across the docs, including: