21st.dev Reference-to-Component Skill

This skill routes between two flows:

• Auto mode: the user provides a reference site URL and wants the agent to inspect it, infer the required sections, choose matching 21st.dev components automatically, and integrate them.
• Manual mode: the user wants guided collection. The agent lists the sections, tells the user what to fetch from 21st.dev, then integrates the returned handoff.

Use this skill only for React-family projects. If the repo is not React-based, explain that v1 of this skill is React-only and stop.

Bundled Resources

• references/categories.md Use for section-to-category mapping and direct 21st.dev category URLs.
• references/manual-handoff-template.md Use when the user is gathering components manually.
• references/section-detection-rubric.md Use during Auto mode after crawling the reference site.
• scripts/resolve-21st-component.mjs Resolve a 21st.dev component page into normalized metadata.