Bootstrap Gallery
Orders
Purchase Today, 06:30pm

Wireless Headphones - $120

Order #34522 • Processing

Account Today, 03:00pm

$180 deducted from your account

Transaction #95622 • Completed

Team Today, 03:15pm

Daniel joined the team

Sales Department • New member

Orders Today, 03:30pm

Smart Watch - $249

Order #34527 • Shipped

New Today, 03:45pm

Bluetooth Speaker - $85

Order #34531 • Payment received

View all
Errors

Solved critical error

Today, 07:30pm

Bug fix

Today, 07:45pm

Production issue

Today, 8:00pm

New ticket

Today, 09:15pm

UI fix

Today, 09:45pm

Signup issue

Today, 10:45pm

View all
Invoices
User Avatar

$450.00

Payment received from **NovaCore Systems**.

Invoice #99885 Paid

User Avatar

$290.00

Payment processed from **PixelStack Studios**.

Invoice #99887 Paid

User Avatar

$330.00

**Orion Labs** payment request submitted.

Invoice #99888 Pending

User Avatar

$380.00

Payment failed from **Zenith Technologies**.

Invoice #99889 Failed

View all
Modern Admin Dashboard
Olivia Johnson
Administrator
My Profile Account Settings
My Tasks
5 Reset Password
Logout

Badges

Basic Badges

Use the .badge class with contextual classes to create badges.

Primary Secondary Success Danger Warning Info Dark
Subtle Badges
Primary Secondary Success Danger Warning Info Dark
Pill Badges

Use the .rounded-pill class for rounded pill badges.

Primary Secondary Success Danger Warning Info Dark
Subtle Pill Badges
Primary Secondary Success Danger Warning Info Dark
Badges with Icons

Combine badges with icons for more visual appeal.

Users Completed Rejected Pending Info
Pill Badges with Icons
Users Completed Rejected Pending Info
Trendy Badge Styles

Modern badge styles with gradients and shadows.

Border Badges
Primary Success Danger Warning Info
Interactive Badges
Badge Positions

Position badges on different elements.

Counter Badges
24
8
12
Contextual Badges

Badges showing status and contextual information.

2.5% Growth 1.8% Decline In Progress Needs Attention Today
System Status Badges
System Online Maintenance Mode Critical Error Updating Standby Mode
Badge Sizes

Badges with different size variations.

Small Badges
Large Default Small Smaller Tiny
Custom Sized Pill Badges
Large Pill Normal Pill Small Pill Tiny Pill
Advanced Badge Use Cases

Examples of badges in real-world application scenarios.

User Status Indicators
User
David Brown
Online
User
Michael Johnson
Away
User
Emily Davis
Offline
Product Status Badges
MacBook Pro M2
In Stock
iPhone 14 Pro
Low Stock
AirPods Max
Out of Stock
Task Status Indicators
Database Migration
Due in 2 days
In Progress
UI Design
Due today
Completed
API Integration
Overdue by 1 day
Delayed
© Bootstrap Gallery 2025