UI Components
Code-based UI component generation and styling
fullstack-development
by Olino3
Forge is a marketplace for a Claude Code Plugins
loopwind
by tomtev
Use when working with .loopwind/ templates, loopwind CLI, OG images, social cards, or animated videos. Helps create, edit, and render image/video templates using Tailwind CSS + Satori.
plan-b
by bohdan-shulha
Create a concise plan for coding/build tasks, especially when users say "I want to make..." or "I need to do...". Use to generate a final plan by aggregating multiple subagent plan variants, include ASCII diagrams/flows/UI mockups when possible, and follow the create-plan style (read-only scan, minimal questions).
slidev
by abpai
Create and present web-based slides for developers using Markdown, Vue components, code highlighting, animations, and interactive features. Use when building technical presentations, conference talks, or teaching materials.
req-change-workflow
by qingchunwuhui
Standardize requirement/feature changes in an existing codebase (especially Chrome extensions) by turning "改需求/需求变更/调整交互/改功能/重构流程" into a repeatable loop: clarify acceptance criteria, confirm current behavior from code, assess impact/risk, design the new logic, implement with small diffs, run a fixed regression checklist, and update docs/decision log. Use when the user feels the change process is chaotic, when edits tend to sprawl across files, or when changes touch manifest/service worker/OAuth/storage/UI and need reliable verification + rollback planning.
prp-generator
by Xyxy1722
Generate comprehensive Product Requirement Plans (PRPs) for feature implementation with thorough codebase analysis and external research and providing structured templates and comprehensive implementation guidance. Use when the user requests a PRP, PRD, or detailed implementation plan for a new feature. Conducts systematic research and identifies patterns.
deepwiki
by huguangju
Generate DeepWiki-style source code documentation for local codebases, transforming engineering experience into reusable cognitive structures
accessibility
by Olino3
"Build WCAG 2.1 AA compliant websites with semantic HTML, proper ARIA, focus management, and screen reader support. Includes color contrast (4.5:1 text), keyboard navigation, form labels, and live regions."
kabumart-analyzer
by bi-al1
KabuMartのスクリーンショットから銘柄を分析し、インタラクティブなHTMLダッシュボードを生成するスキル。 ユーザーがKabuMartのスクショを貼り付けたら、画像解析→yfinanceデータ取得→WebSearch調査→HTML生成を自動で行う。 「銘柄分析」「KabuMart」「株分析」「企業分析」「スクリーニング結果」「この銘柄どう？」など、 日本株の個別銘柄を調べたいときに必ず使う。スクリーンショットが添付されていなくても、 銘柄コード（4桁）や企業名が指定されていればWebSearchのみで分析を実行できる。
telegram-react
by paulo20223
Telegram reaction tags in replies. Use when composing any Telegram reply — add [react:<emoji>] to express a reaction to the user's message. Natural use, not just on explicit request.
accessibility
by arielperez82
Audit and improve web accessibility following WCAG 2.1 guidelines. Use
chain-of-responsibility-react
by progmichaelkibenko
Implements the Chain of Responsibility pattern in React. Use when the user mentions chain of responsibility, CoR, or when you need to chain handlers that each process and pass to the next—validation pipelines, contextual help, event handling, or any sequential pipeline.
GitHub Pages Skill
by iamthetonyb
Requires owner approval (low risk â public static content only).
now-how
by h14h
Generate, update, or consult a project's HOW.md and domain specs — the architecture map and domain-specific documentation that tells collaborators how the codebase is organized and what they need to know beyond what the code itself shows. Use when the user wants to document the codebase architecture, create or update domain specs, write a HOW.md, map the codebase, keep documentation in sync with code changes, or when you need to understand a project's architecture before answering questions or doing work. Triggers include "now how", "document the architecture", "write specs", "update the docs", "map the codebase", "update the spec for [domain]", "create docs", "how does [X] work in this project", "check the docs first", or "use now-how".
pencil
by nickbreaton
Design UI in .pen files using Pencil MCP (pencil.dev). Use this skill when creating designs, screens, dashboards, landing pages, components, or editing .pen files. Covers batch_design operations, component patterns, layout systems, style guides, and visual verification workflows.
UX QA & A11y Reviewer
by anorbert-cmyk
UX QA and Accessibility Reviewer catching inconsistencies, edge cases, and accessibility regressions.
algorithmic-art
by dvorkinguy
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.
pds
by jsstechio
Pencil Design System generator. Invoke with /pds followed by a business domain (e.g., "/pds coffee shop that sells coffee online"). Creates a complete design system with tokens, foundations, components, patterns, and optional screens in a .pen file.
HTML Injection Testing
by jcastillotx
This skill should be used when the user asks to "test for HTML injection", "inject HTML into web pages", "perform HTML injection attacks", "deface web applications", or "test content injection vulnerabilities". It provides comprehensive HTML injection attack techniques and testing methodologies.
idempiere-plugin-development
by comitsrl
"Desarrollo de plugins/modulos para iDempiere (OSGi bundles) con Maven/Tycho: crear un nuevo plugin, extender iDempiere sin tocar core (procesos, callouts, model validators, event handlers, formularios ZK, integraciones), empaquetar y entregar (feature/update-site). Usar cuando el trabajo implica agregar o modificar funcionalidad via plugin."
briefcraft
by aysegulbilgen
Turn messy inputs into structured briefs that help teams work smoothly with Marketing, and help Marketing brief agencies and designers clearly. Detect the right mode, ask missing questions, then output a Notion-style one-pager plus a Slack-ready summary.
mui
by VisualxIntelligence
Material-UI v7 component library patterns including sx prop styling, theme integration, responsive design, and MUI-specific hooks. Use when working with MUI components, styling with sx prop, theme customization, or MUI utilities.
Bep Design System — SKILL.md
by Cyclops8833
Bep Design System · Northset Advisory · Last updated April 2026
react
by yldgio
React component patterns, hooks best practices, state management, and performance optimization