# Bootstrap

URL: https://softwaredictionary.org/terms/bootstrap
Category: Web Development
Last updated: 2026-10-06
Pronunciation: BOOT-strap

In short: Bootstrap is a free CSS framework with a responsive grid and ready-made components, such as buttons, navbars and modals, used by adding its classes to HTML.

## What is Bootstrap?

Bootstrap was built at Twitter by Mark Otto and Jacob Thornton and released as open source in 2011. It gives you a stylesheet and a JavaScript file: link them in your page, add class names such as `btn btn-primary` or `card` to your HTML, and you get consistent buttons, forms, cards, navigation bars, alerts and dialogs without writing CSS yourself.

Its layout system is a 12-column grid built on flexbox. You put content in a `container`, split it into rows with `row` and give each column a width per screen size, so `col-md-6` takes half the width from medium screens up and the full width below. Interactive components such as dropdowns, modals and carousels come with JavaScript plugins, which no longer need jQuery since Bootstrap 5, released in 2021. The current version, 5.3, adds a dark color mode, and the source is written in Sass, so you can change colors, spacing and fonts and leave out the parts you don't use.

Bootstrap is like a furnished apartment: you can move in and start working right away, but changing the look takes effort, which is why many Bootstrap sites look alike. It remains common for admin panels, internal tools and prototypes, where a clean, familiar design matters more than a unique one.

It is most often compared with Tailwind CSS. Bootstrap ships finished components with their own look, so a card is a single class; Tailwind ships small utility classes such as `p-4` and `rounded-lg`, and you assemble every design from them. Bootstrap has utility classes too, and there are component libraries built on Tailwind, but the starting points differ: a ready-made design versus building blocks.

## Key takeaways

- Bootstrap is a CSS framework with ready-made components and a responsive grid.
- You style pages by adding its classes, such as `btn` and `col-md-6`, to HTML.
- The grid has 12 columns and adapts to screen sizes with breakpoints.
- Since version 5, its JavaScript components no longer need jQuery.
- Bootstrap gives you a finished look; Tailwind gives you utilities to build your own.

## Example: A responsive two-column layout with a Bootstrap card

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css">

<div class="container">
  <div class="row">
    <div class="col-md-8">Main content: full width on phones, 8 of 12 columns from medium screens</div>
    <div class="col-md-4">
      <div class="card">
        <div class="card-body">
          <h5 class="card-title">Newsletter</h5>
          <button class="btn btn-primary">Subscribe</button>
        </div>
      </div>
    </div>
  </div>
</div>
```

## Frequently asked questions

**Is Bootstrap still used?**

Yes. It is still one of the most widely used CSS frameworks, especially for dashboards, internal tools and quick prototypes, although many new projects choose Tailwind CSS or a component library made for their framework.

**What is the difference between Bootstrap and Tailwind CSS?**

Bootstrap provides ready-made components with a recognizable default design. Tailwind provides low-level utility classes, so you build your own design and components from them.

**Does Bootstrap need jQuery?**

Not since Bootstrap 5. Version 4 and earlier used jQuery for their interactive components; version 5 rewrote them in plain JavaScript and uses the Popper library only to position dropdowns, tooltips and popovers.

## Sources

- [Bootstrap documentation: Get started with Bootstrap](https://getbootstrap.com/docs/5.3/getting-started/introduction/)

---

Software Dictionary: https://softwaredictionary.org/ · https://softwaredictionary.org/llms.txt