Bootstrap 5 Alpha Released: Major Changes and New Features
Bootstrap 5 Alpha introduces a jQuery‑free core, drops Internet Explorer support, revamps the documentation UI, adds CSS custom properties, expands the grid system and utilities, and brings numerous enhancements to forms, colors, and overall developer experience.
The Bootstrap team announced the Alpha release of Bootstrap 5, highlighting two major shifts: the framework no longer depends on jQuery and it has dropped support for Internet Explorer. Additional improvements include a new API, changes to the grid system, and enhanced documentation.
The documentation received a visual overhaul with a refreshed layout, a new logo, and an upgraded sidebar that uses collapsible sections for faster navigation, improving readability and usability.
Bootstrap 5 removes the jQuery dependency, resulting in smaller file sizes and faster page loads. JavaScript components have been refined; for example, the Button plugin is largely replaced by native HTML and CSS, with state toggling now driven by checkboxes and radio buttons.
With IE support removed, Bootstrap 5 adopts CSS custom properties, extending them beyond colors and fonts to cover more components and layout options, offering developers greater styling flexibility.
The documentation has been expanded with clearer explanations, reduced ambiguity, and more extensive guidance for extending Bootstrap. A starter npm project is provided to help developers get up and running quickly.
The color palette has been broadened, providing a comprehensive system that simplifies visual customization without leaving the codebase, and includes improved contrast ratios and contrast metrics in the color documentation.
Forms have been overhauled into a dedicated "Forms" section, consolidating all form styles and components, and ensuring that each control (checkboxes, radios, selects, file inputs, ranges, etc.) has a unified, semantic appearance without extra markup.
A new utility API allows developers to create, modify, or remove utilities directly from the source files, offering a powerful way to customize the framework.
The grid system receives several updates: a new grid layer is added; the .gutter class is replaced by the .g* utility similar to margin/padding utilities; vertical spacing classes are introduced; and by default, columns no longer use position: relative . The following changes summarize the grid updates: Added a new grid tier. Replaced .gutter with .g* utility. Form layout options moved to the new grid system. Introduced vertical spacing classes. Columns no longer have position: relative by default.
The documentation site has switched its static site generator from Jekyll to Hugo, resulting in faster load times. The team is also exploring new features such as RTL support, off‑canvas menus, a Sass module system, increased use of CSS custom properties, and embedding SVGs directly in HTML instead of CSS.
Laravel Tech Community
Specializing in Laravel development, we continuously publish fresh content and grow alongside the elegant, stable Laravel framework.
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.