Bootstrap 4 Stable Released, and What to Expect Next

Published on by

Bootstrap 4 Stable Released, and What to Expect Next image

Bootstrap 4 stable was released today! We’ve covered the progress here on Laravel News leading up to Bootstrap 4 stable, from the first beta to the final beta, and we even released a Bootstrap 4 preset for Laravel 5.5.

Bootstrap 4 stable is years in the making:

It’s literally taken us years to do it, but Bootstrap 4 has finally arrived! Words cannot begin to describe the elation the entire team and I have for this release, but I’ll do my best. Thank you to everyone, especially to the team, and to everyone who’s contributed code in a pull request or opened an issue. Thank you.

A highlight of the release is a new Bootstrap 4 examples page which will come in handy as you migrate from the comfort of Bootstrap 3 over to Bootstrap 4. I’ve been using it for a couple of months, and while some things are the same, it’s very brand new in many ways and will take you some getting used to.

I am excited to dive into a few of the new examples, such as the pricing page and the checkout form which are very pertinent to a current project of mine.

New Approach in Bootstrap 4 Stable

Another exciting announcement in the release is the new approach documentation, which includes “guiding principles, strategies, and techniques used to build and maintain Bootstrap so you can more easily customize and extend it yourself.”

I found this part of the summary stick out, which resonates in part with atomic CSS approaches like Tailwind and Tachyons:

Whenever possible, use utilities over custom styles

Which is further expounded later in the document:

Utility classes—formerly helpers in Bootstrap 3—are a powerful ally in combatting CSS bloat and poor page performance. A utility class is typically a single, immutable property-value pairing expressed as a class (e.g., .d-block represents display: block;). Their primary appeal is speed of use while writing HTML and limiting the amount of custom CSS you have to write.

Specifically regarding custom CSS, utilities can help combat increasing file size by reducing your most commonly repeated property-value pairs into single classes. This can have a dramatic effect at scale in your projects.

Here’s the full summary of the approach:

  • Components should be responsive and mobile-first
  • Components should be built with a base class and extended via modifier classes
  • Component states should obey a common z-index scale
  • Whenever possible, prefer a HTML and CSS implementation over JavaScript
  • Whenever possible, use utilities over custom styles
  • Whenever possible, avoid enforcing strict HTML requirements (children selectors)

I suggest you read over the full document; it’s an excellent read written by folks that are writing an extremely high-usage, robust CSS framework.

Next Steps

Bootstrap 4 has already laid out release plans on GitHub using project boards, and announced the overhaul of the official Bootstrap Themes this year. Although we don’t know the exact timeline, themes could be available as early as “a first quarter launch,” and will feature at least ten brand new themes.

Learn More

Check out the official Bootstrap 4 release announcement and jump over to the documentation to start using Bootstrap 4!

I’ve also updated the Laravel News Bootstrap 4 preset to use the stable release of Bootstrap (v1.3.0).


Paul Redmond photo

Full stack web developer. Author of Lumen Programming Guide and Docker for PHP Developers.

Filed in:

Laravel Newsletter

Join 40k+ other developers and never miss out on new tips, tutorials, and more.


Version 4 of Tinkerwell is available now. Get the most popular PHP scratchpad with all its new features and simplify your development workflow today.

Visit Tinkerwell

The latest

View all →
Use Ollama LLM Models Locally with Laravel image

Use Ollama LLM Models Locally with Laravel

Read article
TallStackUI - a new component library for TALL Stack apps image

TallStackUI - a new component library for TALL Stack apps

Read article
Laravel 10.34 Released image

Laravel 10.34 Released

Read article
Laravel Tailwind Merge image

Laravel Tailwind Merge

Read article
Generate Validation Rules from a Database Schema in Laravel image

Generate Validation Rules from a Database Schema in Laravel

Read article
A Feature Flags Implementation for Filament image

A Feature Flags Implementation for Filament

Read article
Honeybadger logo


Zero-instrumentation, 360 degree coverage of errors, outages and service degradation.

Laravel Forge logo

Laravel Forge

Easily create and manage your servers and deploy your Laravel applications in seconds.

Laravel Forge
Oh Dear logo

Oh Dear

Oh Dear is the best all-in-one monitoring tool for all your Laravel apps.

Oh Dear
Tinkerwell logo


The must-have code runner for Laravel developers. Tinker with AI, autocompletion and instant feedback on local and production environments.

Kirschbaum logo


Providing innovation and stability to ensure your web application succeeds.

Shift logo


Running an old Laravel version? Instant, automated Laravel upgrades and code modernization to keep your applications fresh.

Bacancy logo


Supercharge your project with a seasoned Laravel developer with 4-6 years of experience for just $2500/month. Get 160 hours of dedicated expertise & a risk-free 15-day trial. Schedule a call now!

LoadForge logo


Easy, affordable load testing and stress tests for websites, APIs and databases.

Paragraph logo


Manage your Laravel app as if it was a CMS – edit any text on any page or in any email without touching Blade or language files.

Lucky Media logo

Lucky Media

Bespoke software solutions built for your business. Partner with Lucky Media, your favorite Laravel Development Agency!

Lucky Media
Lunar: Laravel E-Commerce logo

Lunar: Laravel E-Commerce

E-Commerce for Laravel. An open-source package that brings the power of modern headless e-commerce functionality to Laravel.

Lunar: Laravel E-Commerce