Convert validated Mermaid diagrams into Figma frames and components.
npx skills add https://github.com/fabioeloi/omni-architect --skill figma-generator
Please help me install this Agent Skill. Skill: Figma Generator Source: https://github.com/fabioeloi/omni-architect/tree/main/skills/figma-gen Command: npx skills add https://github.com/fabioeloi/omni-architect --skill figma-generator
This Skill automates turning validated Mermaid diagrams into ready-to-use Figma assets, ensuring visual consistency and faster handoff between design and engineering.
Use the Figma Generator to convert verified Mermaid diagrams into Figma frames and components within your active file.
High-intent search queries and answers about installing and using this skill.
To convert Mermaid diagrams into Figma frames and components, this Skill automates asset creation by mapping diagram nodes to components and applying design tokens through the Figma REST API.
Yes, you can apply design tokens for color, typography, and spacing when generating Figma assets from Mermaid diagrams to ensure a cohesive design system across the created frames and components.
The Figma Generator connects to the Figma REST API to manage pages, map nodes to components, apply design tokens, and provide developer annotations for generated asset flows.
The best way to automate UI design handoff from diagrams to Figma is generating a shareable Figma file with navigable pages, organized frames, and developer annotations directly from validated Mermaid diagrams.
vladm3105Generate syntactically correct Mermaid diagrams for technical documentation.
Pythagora-ioExtract structure, components, styles, and assets from Figma files via the REST API.
mrgreenishSynchronize tokens.json with Figma variables and generate design system documentation pages.
rjroyGenerate Mermaid diagrams for data flows, class relationships, and architectures.
