A curated collection of awesome things related to status badges.
While this list is maintained by Paul Melnikow from the Shields core team, it includes Shields-related and non-Shields-related resources.
- Shields.io – Original home of the badges, launched in 2014.
- Badgen.net – Fast badge generating service launched in 2018.
- NodeICO – Large-format status badges for Node.js projects – which were once very popular!
SVG badges are encouraged because they render better on Retina displays and scale up beautifully. However in a few environments, such as Slack and HTML email, SVG images won't render, so PNG badges are preferred. Shields offers raster badges through its raster server,
raster.shields.io
.
- svg-to-image-proxy –
Rasterizing proxy based on Node and Puppeteer which can be hosted on Vercel.
(Since 2019 this code has been used to run
raster.shields.io
, however it's about to be deprecated in favor of squint.) - squint – Rasterizing proxy based on Rust and libcairo.
- For The Badge – Provides static badges
using a flat and boxy badge design which has become a classic. (This badge
format is available as
?style=for-the-badge
on Shields.io.)
- Badges 4 README.md Profile – Catalog of Shields.io Badges for readme profiles
- Project Types – Static badges for four types of open-source project, as classified in Nadia Eghbal's Working in Public.
- Simple Badges – Catalog of Shields.io Badges with Simple Icons
Dynamic data providers are third parties who publish data APIs which can be used to back one of the dynamic badge services:
- Transifex open API endpoints – Data gateway for projects using Transifex.
- Cell Shield – a service that allows backing a shields.io badge with a cell from a public Google Spreadsheet.
- TYPO3 Badges – API that provides JSON endpoints to render badges of TYPO3 CMS extensions via Shields or Badgen.
- Dynamic Badge Formatter – Allows users to apply formatters for metrics, versions, dates, and more to dynamic shields.io badges to make them look consistent.
- badge-maker – JavaScript; supports plastic, flat, flat-square, for-the-badge, and social styles. Powers Shields.io.
- badgen – TypeScript; supports classic and flat. Powers Badgen.
- gradient-badge – JavaScript; generates gradient badges in classic and flat.
- poser – PHP.
- pybadges – Python.
- browser-support-badge – JavaScript; generates browser version compatibility badges.
- badge4j – Java.
- Simple Icons – Home of the bulk of the icons used by both Shields and Badgen.
- Custom Icon Badges – Allows users to more easily use Octicons and their own icons and logos on shields.io badges.
- Simple Badges – Website for finding and previewing Simple Icons on shields.io badges.
- Badges on npm packages – Data-driven assessment based on signaling theory applied to how badges are used in npm. Published in ICSE 2018.
- On the Usage of Badges in Open Source Packages on GitHub – Data-driven study of how status badges are used in Cargo and Packagist projects.
- An Open Source Rage Diamond (Jun. 5, 2014) – An article about the motivation for the Shields project by one of its creators.
- Shields badge specification – Visual design specification for Shields.
- Shields.io by Nicco Kunzmann – A talk given by Nicco Kunzmann for I Love Free Software Day in Berlin, Feb. 14, 2019.
- Cool badges for your project by Marcin Mielnicki (photos) – A talk given by Shields core team member Marcin Mielnicki for Hacktoberfest Poznań 2018.
- Shields self-hosting – Host your own copy of Shields to Heroku, Vercel, using Docker, or on a Node server.
- Badgen self-hosting – Host your own copy of Badgen on Vercel.
- Open Badges – A specification for verifiable digital badges.
- Badgr – A service for creating verifiable achievement badges, based on the Open Badges specification.