Shields.io

SVG形式のバッジサービス

https://img.shields.io/badge/dynamic/json.svg?color=06B632&style=for-the-badge&label=井戸端&suffix=+pages&query=$.count&url=https://scrapbox.io/api/pages/villagepump#.svg

URLのパターンでカスタムバッジを作ることができる

[https://img.shields.io/badge/${subject}-${status}-${color}.svg]

subject : バッジの左側に入る文言

status : バッジの右側に入る文言

color : 色

作ってみた

https://img.shields.io/badge/Scrapbox-井戸端-d8d8d8.svg?style=flat

元ネタ

他のバッジの例

https://img.shields.io/badge/Javascript-276DC3.svg?logo=javascript&style=flat

https://img.shields.io/badge/-TypeScript-007ACC.svg?logo=typescript&style=flat&logoColor=white

https://img.shields.io/badge/-Python-F9DC3E.svg?logo=python&style=flat

https://img.shields.io/badge/-CSS3-1572B6.svg?logo=css3&style=flat

https://img.shields.io/badge/-HTML5-333.svg?logo=html5&style=flat

[https://img.shields.io/badge/dynamic/json.svg?color={COLOR}&style=for-the-badge&label={LABEL}&suffix=+pages&query=$.count&url=https://scrapbox.io/api/pages/{project_id}#.svg]

で、Scrapboxプロジェクトのページ数を取ってこれるようだ。（公開プロジェクトしかできない）

例

https://img.shields.io/badge/dynamic/json.svg?color=green&style=for-the-badge&label=井戸端&suffix=+pages&query=$.count&url=https://scrapbox.io/api/pages/villagepump#.svg

https://img.shields.io/badge/dynamic/json.svg?color=green&style=for-the-badge&label=アープラノート&suffix=+pages&query=$.count&url=https://scrapbox.io/api/pages/arpla#.svg