# Bootstrap 6 alpha drops legacy browsers and rewrites Sass, responsive classes and JavaScript imports

Bootstrap 6's first alpha replaces Sass variable overrides with CSS-first token maps, changes responsive class names, makes JavaScript plugins ESM-only and raises the minimum browser versions. It is a preview, not a production-stable migration target.

A major UI framework is moving from legacy Sass and JavaScript conventions to native CSS and ESM. Existing Bootstrap 5 projects need a deliberate migration plan, not a blind version bump.

- Status: Active
- Published: 2026-10-17T14:53:06+13:00
- Updated: 2026-10-17T14:53:06+13:00
- Categories: Web Development, JavaScript, Browsers & Web Standards, Frameworks, Developer Tools
- Tags: Bootstrap, CSS, JavaScript, migration, Sass
- Canonical HTML: https://beyondthe.news/dossiers/bootstrap-6-alpha-css-tokens-esm-responsive-prefix-browser-support

## What changed

On October 8, 2026, Bootstrap published version 6.0.0-alpha.1, its first major-version preview since Bootstrap 5. The framework now requires Chrome and Edge 130+, Firefox 132+ and Safari 18+, dropping the old browser fallbacks. It replaces most Sass variable-based visual customisation with CSS custom properties and Sass @use/@forward token maps, switches JavaScript plugins to ESM-only modules, and changes responsive utility and component variant naming from infixes such as d-md-none and col-lg-6 to prefixes such as md:d-none and lg:col-6. Native browser primitives including dialog, details/summary, container queries, :has(), oklch(), light-dark() and CSS layers replace older framework machinery.

## Why it matters

Bootstrap remains an important default UI layer for many server-rendered websites, PHP apps, admin tools and design systems. This is not a routine patch: CSS class names, Sass customisation entry points, JavaScript imports and supported browser versions change together. Builders who maintain long-lived Bootstrap 5 themes or components must assess whether a future v6 migration is worth the rework and which browser populations they can leave behind. The alpha is available for experiments, not a signal to upgrade production sites now.

## Responsive classes and Sass customisation are migration breaks

The new prefix system changes class selectors across grid, utilities, components and states: col-lg-6 becomes lg:col-6, and d-md-none becomes md:d-none. Sass @import and old global variables are no longer the normal extension surface. Visual tokens move into CSS custom properties, while @use/@forward and token maps generate component styles; projects with extensive Sass overrides will need a rework.

## JavaScript plugins become ESM-only

Bootstrap 6 removes UMD bundles and the window.bootstrap global. CDN users must load the bundle with type=module; code calling constructors should import named APIs. Teams bundling Bootstrap need to audit how their build tool handles ESM and verify their data-attribute integrations.

## The modern browser floor enables simpler native UI

The alpha requires Chrome/Edge 130, Firefox 132 and Safari 18, instead of Bootstrap 5's much older support baseline. The rewrite leans on CSS layers, container queries, native dialog, details/summary and colour APIs, without polyfills for browsers below the new floor. Bootstrap 5 remains supported; maintainers say 5.4.0 will arrive before an end-of-life date is announced.

## An alpha is a migration laboratory, not general availability

Bootstrap 6.0.0-alpha.1 is installable from npm and CDN, with early documentation and a migration guide. API details can still change before a stable release. The appropriate near-term action is testing real Bootstrap 5 components and Sass overrides in a separate branch, measuring breakage and browser reach, not assuming the preview is production-ready.

## Key details

- Bootstrap 6.0.0-alpha.1 was announced October 8, 2026.
- New minimums: Chrome/Edge 130, Firefox 132 and Safari 18.
- Responsive utility and component variant classes change to prefix notation.
- Sass customisation moves to @use/@forward and token maps backed by CSS variables.
- JavaScript plugins are ESM-only; no UMD or window.bootstrap global.
- Bootstrap 5 remains supported and has no announced end-of-life date.

## Builder takeaways

- Do not auto-upgrade production Bootstrap 5 sites to the v6 alpha.
- Inventory Sass variable overrides, custom imports and generated classes before testing a migration.
- Search templates for responsive infix classes and JavaScript references to window.bootstrap.
- Test actual browser audience against the new minimum versions, especially older Safari and embedded browsers.
- Use a separate alpha branch to test native dialog/accordion behaviour, CSS specificity and theming.

## What to watch

- Follow-up Bootstrap 6 alphas and migration-guide changes.
- Bootstrap 5.4.0 release and the eventual v5 end-of-life date.
- Stabilisation of v6 JS imports, component APIs and CSS tokens before GA.

## Uncertainties

- This is an alpha; details and release timing can change.
- The maintainers' cumulative installation figure is self-reported and does not establish current usage share.
- No independent production-wide compatibility testing of v6 alpha is yet established.

## Sources

- [Bootstrap 6 Alpha](https://blog.getbootstrap.com/2026/10/08/bootstrap-6-alpha/) — Bootstrap · primary release · 2026-10-08T00:00:00+13:00. Detailed official browser minimums, Sass and CSS migration, responsive class changes, ESM-only JavaScript and alpha status.
- [JavaScript Weekly #806](https://javascriptweekly.com/issues/806) — JavaScript Weekly · independent specialist radar · 2026-10-13T00:00:00+13:00. Independent ecosystem discovery of H3 v2; technical claims checked against upstream.

