Logo
Status Page

Status Page Documentation

Common troubleshooting topics: Creating a status page, setting up a monitor, incident management, etc.

Using the SVG Status Badge

StatusPage.me Dec 9, 2025 Embeds & Integrations

Using the SVG Status Badge

The SVG badge is a simple, lightweight way to show your current status. It’s perfect for README files, documentation, and anywhere you need a simple indicator.

SVG badge examples


What Is the SVG Badge?

The SVG badge is a small image that:

  • Shows your current overall status
  • Updates automatically
  • Requires no JavaScript
  • Works anywhere images work

It looks like: Status


Getting the Badge URL

  1. Go to Status Pages > Embeds / Widgets
  2. Find the SVG Badge section
  3. Copy the image URL

Your badge URL looks like:

https://statuspage.me/badge/your-slug.svg

Using in HTML

Add the badge to any webpage:

<img 
  alt="Status" 
  src="https://statuspage.me/badge/your-slug.svg" 
/>

Using in Markdown

Perfect for GitHub, GitLab, or documentation:

Badge Only

![Status](https://statuspage.me/badge/your-slug.svg)
[![Status](https://statuspage.me/badge/your-slug.svg)](https://your-slug.statuspage.me)

This makes the badge clickable, linking to your full status page.


Common Uses

LocationExample
GitHub READMEShow project status at the top
DocumentationIndicate service availability
Email signaturesQuick status check for customers
DashboardsLightweight status indicator

Badge States

The badge automatically reflects your status:

StatusColor
OperationalGreen
Degraded PerformanceYellow
Partial OutageOrange
Major OutageRed
MaintenanceBlue

Caching

The badge is cached for performance:

  • Updates within a few minutes of status changes
  • Reduces load on your status page
  • Ensures fast loading on your site

If you need immediate updates, use the live widget instead.


Combining with Other Badges

The SVG badge works great alongside other badges:

![Build](https://img.shields.io/badge/build-passing-success)
![Version](https://img.shields.io/badge/version-2.0.0-blue)
![Status](https://statuspage.me/badge/your-slug.svg)

What’s Next?

Was this article helpful?

Share this article: