Component Metadata Prompts

Prompt templates for extracting, documenting, and sharing component metadata.

All Prompts

Extract component info

From the selected Figma component, extract all properties and variants and generate a TypeScript interface.
Analyze the selected component and output a markdown table of variants, sizes, and states.
List all design tokens used by this component (color, typography, spacing, radius, shadow).

Documentation prompts

Generate a README for this component including purpose, props, variants, and React usage examples.
Write user stories for this component's key usage scenarios and interactions.

Collaboration prompts

Generate Storybook stories for this component with controls for all props.
Draft a Slack update for #design-system describing the latest component changes with a Figma link.