Frameworks Compared

CSS frameworks fall into three families. Component frameworks (Bootstrap 2,007 , Bulma 99,637 , Foundation) ship prebuilt classes such as .btn and .card. Utility engines (Tailwind CSS 5,202 , UnoCSS) scan your source files and generate one small class per declaration you actually use. Minimal layers (Pico 441,173 , Open Props) style bare semantic HTML or supply design tokens, and leave components to you.

CSS frameworks in September 2026 (sizes measured from the jsDelivr 15,886 builds)
Framework	Approach	Licence	Size (min + gzip)	GitHub 29 stars
Bootstrap 5.3.8	Components, utilities, JS plugins	MIT	30.8 KB CSS + 23.7 KB JS	174.8k
Tailwind CSS 4.3	Utility-first, generated on build	MIT	Only classes you use	97.6k
Bulma 1.0.4	Components, Sass 22,539 , no JavaScript	MIT	65.2 KB	50.1k
Foundation 6.9.0	Components, Sass, JS plugins	MIT	17.6 KB CSS	—
Pico CSS 2.1.1	Styles semantic HTML	MIT	11.6 KB	16.9k
Open Props 1.7	Tokens as custom properties	MIT	7.7 KB	5.5k
UnoCSS 66.10	Atomic engine with presets	MIT	Only classes you use	19.0k

A component framework's full file is the ceiling you ship if you never prune it; PurgeCSS 955,901 (CSS Debugging and Tooling) cuts Bootstrap's CSS by more than 90% on a small page. Utility engines have no fixed size, and their output grows slowly because every page reuses the same atoms.

Bootstrap (Bootstrap) suits dashboards, internal tools and teams that want accessible JavaScript widgets out of the box.
Tailwind CSS (Tailwind CSS) suits custom designs in component-based apps. UnoCSS, by Anthony Fu, has no utilities in its core: presets such as preset-wind4 add Tailwind-compatible classes and preset-icons turns any Iconify 8,914 icon into a class.
Bulma (no JavaScript) and Foundation (with JavaScript) are Sass-based component kits; import only the modules you need. Foundation's last release, 6.9.0, dates from September 2024.
Pico fits documentation sites and prototypes: good typography and forms without class names.
Open Props provides 500+ tokens (--size-3, --radius-2, --shadow-2) and no selectors, so it combines with any approach.

Pico's class-less build styling plain semantic HTMLHTMLLive

<link rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@picocss/pico@2.1.1/css/pico.classless.min.css">
<main>
  <h3>Join the newsletter</h3>
  <form>
    <label>Email <input type="email" placeholder="you@example.com"></label>
    <label><input type="checkbox" role="switch" checked> Weekly digest</label>
    <button type="submit">Subscribe</button>
  </form>
</main>

Browser output of 94

No element carries a class, yet the form gets spacing, a switch, focus rings and automatic dark mode. Judge a framework by the CSS you will override: if most of your rules undo its defaults, tokens or utilities will cost less.

MENU