shieldcn
Beautiful README badges, inspired by shields.io and styled like shadcn/ui.
Shieldcn-badges is an agent skill that empowers AI coding assistants to create polished README files with badges, charts, and headers styled like shadcn/ui components. Designed as an alternative to shields.io, it renders repository statistics, star history charts, contributor walls, and sponsor sections as real UI components. The skill integrates with Claude Code and Cursor through the skills.sh package manager, allowing developers to ask their AI assistant to enhance documentation with professional visual elements. It supports both light and dark themes and can be embedded directly or automated via a GitHub Action.
Key Features
Use Cases
- 01Ask your AI coding assistant to add GitHub star and contributor badges to a new open-source project
- 02Automatically generate and update star history charts in documentation without manual SVG commits
- 03Create professional-looking sponsor walls for README files with consistent shadcn/ui theming
- 04Build repository statistic dashboards showing npm downloads, license, and recent activity
- 05Enhance project README files with visual headers and grouped metric badges
- 06Maintain consistent light/dark theme badge sets across all repository documentation
Related Skills
View moresuperpowers
An agentic skills framework & software development methodology that works.
skills
Skills for Real Engineers. Straight from my .agents directory.
skills
Public repository for Agent Skills
ponytail
Makes your AI agent think like the laziest senior dev in the room. The best code is the code you never wrote.
shieldcn — FAQ
What is the shieldcn-badges agent skill?+
Shieldcn-badges is an agent skill that teaches AI coding assistants like Claude Code and Cursor how to add badges, star charts, headers, and sponsor walls to README files using shadcn/ui-styled components. It provides prompts and templates so your AI assistant can generate professional documentation visuals.
How do I install the shieldcn-badges skill for my AI assistant?+
Install via skills.sh package manager using 'npx skills add jal-co/shieldcn -a claude-code' for Claude Code or 'npx skills add jal-co/shieldcn -a cursor' for Cursor. The skill files will be added to your assistant's configuration automatically.
Which AI coding assistants work with shieldcn-badges?+
The skill is compatible with Claude Code and Cursor, both of which support the skills.sh ecosystem. Other assistants that can read SKILL.md files may also work with manual configuration.
Do I need API keys to use shieldcn badges?+
No API keys are required for basic badge generation. The badges are rendered by making requests to the shieldcn.dev service, which retrieves public data from npm and GitHub. The GitHub Action requires repository permissions (contents: write, pull-requests: write) if using automated pull request mode.
Is shieldcn-badges free to use?+
Yes, the agent skill and badge service are free and open-source under the MIT license. You can use the shieldcn.dev API endpoints in any README or integrate the skill into your AI assistant workflow at no cost.
Can I customize the badge styles and colors?+
Yes, badges support multiple customization options including variant styles (branded, default), sizes (xs, sm, md, lg), custom logos and colors, light/dark mode variants, and theming options like the violet theme for star charts.
How do I install shieldcn?+
Open the source repository on GitHub and follow its README. shieldcn is a skill — MCP Agents Market links you directly to the official repo.
Is shieldcn free?+
shieldcn is an open-source project hosted on GitHub. Check the repository for its license and any usage requirements.