bootstrapbeginnermitFeatured

Bootstrap Stat Cards

A metrics dashboard row.

8.6k1.0k669484

About this module

Four stat cards with icons, values and trend badges in a responsive row.

#bootstrap#stats#dashboard#cards

Source code

Installation

  1. 1

    Install Bootstrap

    Install the package or add the CDN link.

    npm install bootstrap
  2. 2

    Load the CSS

    Import `bootstrap/dist/css/bootstrap.min.css` (and `bootstrap.bundle.min.js` for JS components).

  3. 3

    Paste the markup

    Copy the markup into your page.

Usage

  1. 1

    Copy the markup

    Paste the HTML below into your page or template.

  2. 2

    Check the JS bundle

    This markup is static — no extra JS needed.

Overview
Frameworkbootstrap
Difficultybeginner
Licensemit
Versionv1.0.0
Features
  • Uses Bootstrap 5.3 classes
  • Responsive grid
  • Standard ARIA patterns
Traits
  • ResponsiveYes
  • Dark modeNo
  • AccessibleYes
  • Production readyYes
Dependencies
bootstrap@^5.3.0
Browser support
  • Chrome 90+
  • Firefox 90+
  • Safari 15+
  • Edge 90+

Related modules

Command Palette

Search modules and jump anywhere