Shield CN

Overview

shieldcn is a free, open-source alternative to shields.io that renders README badges, charts and headers as shadcn/ui-styled components. A badge is just an image URL, for example https://shieldcn.dev/npm/react.svg, and it renders in a README as a shadcn button-style badge in SVG or PNG.

The project is built by Justin Levine (jal-co/shieldcn on GitHub, MIT licensed, about 935 stars) and is part of the Vercel OSS Program. Beyond single badges, it offers a badge builder and a visual README Studio that composes headers, badge groups and charts into a full GitHub README.

Features

• 45+ providers: Badges for npm, GitHub, GitLab, Discord and more, in SVG and PNG
• Badge groups: Combine several badges, such as stars, license and last commit, into one image
• Charts: shadcn-styled star history, lifetime commit history, issues over time, npm downloads and custom JSON data as portable SVGs with no JavaScript
• Headers: Banner images for the top of a README
• README Studio: A visual builder for a full README with headers, badges and charts
• Star chart GitHub Action: jal-co/shieldcn@v1 commits light and dark star history SVGs to a repo
• Agent skill: A shieldcn-badges skill lets Claude Code or Cursor add badges, charts and headers

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @shieldcn/component-name