Repository files navigation

Home ofbadgen.net, fast badge generating service.

That's a service, that's a library, hooorey! -@tunnckoCore

Finally something to replacehttp://shields.io -@EGOIST

Epic work on Badgen! Porting the @dependabot badges over to it now. ⚡️ -@greybaker

Thebadgen library was born as an exploration of "is it possible to generate badge SVG markup directly (without using pdfkit/canvas/puppeteer to measure text width)?". The result is better than I expected, Width of Verdana (the de-facto font for badges) text can be calculated precisely with a prebuiltchar-width-table, even no need to worry about kerning 🤯

Then, logically,Badgen Service was born. I had a good time withshields.io, but as time goes by Shields gets slower, leaves more and more broken badges in READMEs. Badgen is trying to be a fast alternative with simplicity and flexibility. Its codebase is simple (2K LoCs vs Shields' 22K LoCs), well structured and fun to develop - it is pretty easy to add badge(s) for new service(s).

In the beginning, I was considering bothVercel andGoogle Cloud Functions. Then Vercel announcedEdge Network on the same day as badgen.now.sh (the PoC of Badgen Service)'s reveal, what a fate! Cloudflare powered Vercel Edge Network is a perfect choice for such service, caching and scalability in simplicity. Badgen is the fastest possible badge generating service out there. It's fast, it's reliable, it's globally distributed and cached, thanks to Vercel.

At the time of badgen.now.sh's reveal, it had only four live badges as demonstrations. Since then, thanks toawesome people's help, Badgen keeps getting better at a fast pace. Welcome to join us, let's build the best badge service in the universe 🔥

• Written in TypeScript
• Usingbadgen library to generate svg on the fly
• Two visual styles
  • https://badgen.net - classic style badges
  • https://flat.badgen.net - flat & square style badges
• Two badge types
  • static badge - URL defined badge (label, status, color)
  • live badge - Show live status from 3rd party services
• Builtin Icons & External Icon Support
  • seebadgen-icons
• Docker imageamio/badgen

start dev server

npm run dev

start prod server

npm run build && npm start

run with docker image

docker run -p 3000:3000 amio/badgen

If a service you wish to have is still missing here, we welcome new contributions. Basically, you need to add a file inapi/[name-of-service].ts and that's it. Take/crates as an example:

• pages/api/crates.ts - main function forcrates badges
• libs/badge-list2.ts - contains index of all live badges

To ensure that your addition is working correctly, start the development server withnpm run dev.

NOTES

• You can create live badge without touching badgen.net's code. Checkout docs for/runkit or/https.

• The/runkit support would be super handy for prototyping a new live badge.

You can contribute icons tobadgen-icons. Please make sure new icon is optimized usingsvgomg.

Badgen useSentry to collect errors for improving service, use Google Analytics on doc pages (home,/github,/packagephobia, etc.) to understand overall usage.

Badgen do not collect any identifying information.

Supported environment variables for managing a Badgen instance.

• GITHUB_TOKENS - Comma delimited list of Github Tokens. Required for Github Badges
• GITHUB_API - Custom Github API endpoint. e.g.,https://github.mycompany.com/api/v3
• GITHUB_API_GRAPHQL - Custom Github GraphQL API endpoint. e.g.,https://github.mycompany.com/api/graphql
• NPM_REGISTRY - Custom NPM registry endpoint
• SENTRY_DSN - Sentry Error Monitoring Data Source Name
• GA_MEASUREMENT_ID - Google Analytics Measurement ID

Thanks to ourcontributors 🎉👏

We are on OpenCollectivehttps://opencollective.com/badgen

Support this project by donation, help Badgen continue and evolving!

[Become a backer]