Skip to content
Markdown Viewer

README Badge Generator

Build GitHub README badges — npm, stars, license, CI, and more

Compose shields.io badge rows for any GitHub project. Pick a preset, fill in the inputs, and copy the Markdown — individually or as a single line. No login or signup.

Preview in editorTOC generatorREADME health
npm version[![npm version](https://img.shields.io/npm/v/react?style=flat)](https://www.npmjs.com/package/react)
GitHub stars[![GitHub stars](https://img.shields.io/github/stars/facebook/react?style=flat)](https://github.com/facebook/react)
License[![License](https://img.shields.io/github/license/facebook/react?style=flat-square)](https://github.com/facebook/react)

Badge images are served by shields.io — the de-facto README badge service. We never proxy or cache; your README references the shields.io URL directly.

How to use the badge generator

  1. Pick a badge preset from the dropdown — npm version, GitHub stars, license, CI status, etc.
  2. Choose a style — flat, flat-square, plastic, for-the-badge, or social.
  3. Fill in the inputs — npm package name, GitHub owner/repo, etc.
  4. Click Copy for an individual badge or Copy all Markdown for the full row.

A good badge row tells a story top-to-bottom:

  1. Version — what you'll get if you install today.
  2. Downloads — how many other people install it.
  3. License — what you can do with it.
  4. CI status — does it build today?
  5. Last commit — is it actively maintained?

That sequence answers the four questions every visitor asks in under three seconds.

When NOT to use badges

  • Internal repos where the badge information is meaningless to the audience.
  • Repos with private CI — the build badge will 404 publicly.
  • Pre-1.0 versions with no users — a "0 downloads" badge undermines confidence.

Companion tools

Privacy & data

This page doesn't upload anything. Badge images are fetched directly from shields.io by your browser when the README renders.

Frequently asked questions

What are README badges?
Small SVG images that show real-time status of a project — version number, downloads, build status, license, stars. Powered by shields.io, they're rendered as standard Markdown image links so they work anywhere Markdown does.
Why use badges?
Three reasons: quick credibility ('we have CI, we ship versions, we have a real license'), discoverability (downloads / stars signal traction at a glance), and convenience (visitors find npm or GitHub with one click).
Which badge types are supported?
npm version, npm monthly downloads, GitHub stars, license, open issues, GitHub Actions status, last commit, and Node engine version. Add as many as you like — each gets its own Markdown line you can copy individually or combine.
Will badges slow down my README?
Badge SVGs from shields.io are small (~500 bytes each) and cached aggressively. A README with 5–7 badges adds negligible load time. Don't go overboard with 20+ badges — pick the ones that actually help visitors decide.
Can I customize colors and labels?
Yes — shields.io supports many params. This tool covers the most common variants (style). For colors and label overrides, edit the resulting Markdown — shields.io URL parameters are well-documented.
Is shields.io reliable?
Shields.io is a well-funded, multi-year project trusted by millions of READMEs. Its uptime is excellent, and if it ever does go down, your badges will simply show alt text — they won't break the rest of the page.