Figma Design System To Design.md

Ekstraherer CSS/Tailwind/Figma design tokens til en strukturert design.md som AI-kodingsverktøy kan referere til.

av albertzhangz10 · albertzhangz10/figma-design-system-to-design-md

Bestått ★ 9.2/10

Figma Design System To Design.md — Ekstraherer CSS/Tailwind/Figma design tokens til en strukturert design.md som AI-kodingsverktøy kan referere til.

Hva den gjør

Skanner et prosjekt for token-filer (tokens.css, tailwind.config.js, theme.ts, etc.), beriker valgfritt med Figma MCP-data, og skriver en design.md som dekker farger, typografi, avstand, radius, elevasjon og responsive regler — merker alt den ikke finner som TODO i stedet for å finne på det. Utløses ved 'generer design.md', 'ekstraher designsystem', eller 'design tokens til markdown'.

Testrapport

Kjørte den mot en reell tokens.css + tailwind.config.js fixture: den flagget korrekt den manglende typografiskalaen og elevasjonsdataen som TODO i stedet for å finne på verdier, og bevarte kildens 'netural' token-navn skrivefeil i henhold til sin egen regel, kontra en baseline dump som tabulerte de samme tokens uten slik disiplin.

Testet på: 2026-07-14 · Claude Code 2.x (agent harness)

Installer

git clone https://github.com/albertzhangz10/figma-design-system-to-design-md
cd figma-design-system-to-design-md
mkdir -p ~/.claude/skills
cp -r skills/figma-design-system-to-design-md ~/.claude/skills/figma-design-system-to-design-md

Kommandoer og eksempelprompter

/figma-design-system-to-design-mdEkstraherer CSS/Tailwind/Figma design tokens til en strukturert design.md som AI-kodingsverktøy kan referere til.

Skills utløses av vanlige forespørsler — ingen kommandoer å huske. Etter installasjonen aktiverer prompter som disse skillen (på engelsk):

Extract our design tokens into a design.md for the AI tools
Pull colors and spacing from tailwind.config into one doc
Document our design system so Claude stops inventing styles

Full rapport →