Shieldcn

Beautiful README badges, inspired by shields.io and styled like shadcn/ui.

Agent skill Docs & writing Design & frontend AI & LLM tooling

Install

$npx skills add jal-co/shieldcn -a claude-code

Claude Code

claude mcp add shieldcn -- npx skills add jal-co/shieldcn -a claude-code

Cursor / Claude Desktop (mcp.json)

{
  "mcpServers": {
    "shieldcn": {
      "command": "npx",
      "args": [
        "skills",
        "add",
        "jal-co/shieldcn",
        "-a",
        "claude-code"
      ]
    }
  }
}

Install command taken from the project's README or registry entry. Always review code before running it.

README excerpt

Read full README on GitHub →

Before anyone reaches your docs, they land on your README, the front door of every open-source project. shieldcn makes that first impression count: badges, charts, headers, and sponsor walls, rendered as real shadcn/ui components. A shields.io alternative.

Homepage · Docs · Studio · 𝕏

Usage

Drop a badge into any README and it renders as a real shadcn Button.

Agent skill

Install the shieldcn-badges skill from skills.sh so your coding agent can add shieldcn badges, charts, and headers to READMEs:

npx skills add jal-co/shieldcn -a claude-code # installs to Claude Code
npx skills add jal-co/shieldcn -a cursor # installs to Cursor

See skills/shieldcn-badges/SKILL.md for prompt examples and options.

Star history

Hosted star charts use GitHub's privacy-safe weekly history API. Embed https://shieldcn.dev/chart/github/stars/{owner}/{repo}.svg for any public repository, or use .png and .json at the same path.

To commit a light/dark SVG pair to your repo, use the shieldcn starchart GitHub Action:

- uses: jal-co/shieldcn@v1
  with:
    theme: violet
    pull-request: true

PR mode needs contents: write, pull-requests: write, and permission for Actions to create pull requests in repository settings.

GitHub Action docs → · action reference

Contributors

MIT · Built by Justin Levine · Contribute

Similar plugs

Skills

Public repository for Agent Skills

Agent skill AI & LLM tooling★ 181k

Ponytail

Makes your AI agent think like the laziest senior dev in the room. The best code is the code you never wrote.

Agent skill AI & LLM tooling★ 164k

UI Ux Pro Max Skill

An AI skill that provides design intelligence for building professional UI/UX across multiple platforms.

Agent skill Design & frontend★ 136k

Graphify

Turn any codebase, with its docs, SQL schemas, configs, and PDFs, into a queryable knowledge graph. A /graphify skill for Claude Code, Cursor, Codex, and Gemini CLI: local…

Agent skill Memory & knowledge★ 127k