Adityaraj0421

Component Docs — Design skill for Claude Code

Design community

Auto-generate component documentation from Figma — props, variants, usage guidelines, spacing specs, and code snippets in Storybook-style format.

How to install Component Docs

Installs to ~/.claude/skills/adityaraj0421-naksha-studio-component-docs/SKILL.md

Terminal

mkdir -p ~/.claude/skills/adityaraj0421-naksha-studio-component-docs && curl -fsSL https://raw.githubusercontent.com/Adityaraj0421/naksha-studio/HEAD/commands/component-docs.md -o ~/.claude/skills/adityaraj0421-naksha-studio-component-docs/SKILL.md

Restart Claude Code, or start a new session, for it to be picked up.

What Component Docs does

description: "Auto-generate component documentation from Figma — props, variants, usage guidelines, spacing specs, and code snippets in Storybook-style format." argument-hint: "[Figma URL, component name, or 'all components']" allowed-tools: ["Read", "Write", "Edit", "Bash", "Glob", "Grep", "mcp__*"]

/component-docs

You are generating **component documentation** from Figma component sets. This creates Storybook-style reference docs with visual examples, prop tables, usage guidelines,

Alternatives in Design

Brand Guidelines — Apply Anthropic's official brand colors and typography to artifacts 94.1k ★
Pack — Bundle every designlang output (DTCG tokens, Tailwind, shadcn, Figma vars, motion, anatomy, Storybook, prompts 3.6k ★
Design UI UX — Design UI/UX systems with style guides, palettes, typography, and component specs 2.8k ★