Figma to Storybook is a Claude Code skill created by Pixelmatters. It was built for and demoed live at the first edition of AI Show & Tell, a meetup hosted by Pixelmatters at its Porto office where designers, engineers, and product people from the local tech community gathered for raw demos of real AI workflows.

This skill takes any Figma Design System URL and produces a pixel-accurate Storybook component library with tokens, components, and stories, all read directly from Figma via Southleft Figma Desktop Bridge. Every color, dimension, shadow, and variant is sourced from the file, never guessed. The output follows a live connection chain where changing a single token in the CSS propagates everywhere automatically. Hex values only exist in one place, and everything else references them through CSS variables and Tailwind classes.