qt-figma-component-generation
Extract component metadata from a Figma design system and generate production-ready QML controls. Use this skill whenever someone wants to turn Figma components into QML files — whether they say "generate components from Figma", "create QML controls based on a design system", "convert Figma components to QML", "build the component library", "extract button/input/checkbox from Figma", or anything similar. Requires design-tokens.json and QML design system singletons to already exist (from the token extraction skill). Uses Figma MCP to inspect components one at a time and maps variants, states, sizing, and token usage to idiomatic Qt Quick Controls 2 patterns. Trigger this skill at the component generation step of any QML design-system workflow.
Install
With your agent
Install OMGSkills skill "theqtcompanyrnd/agent-skills:skills/qt-figma-component-generation" into this agent's normal skills directory: call the OMGSkills MCP get_install_plan tool for your agent and run the script it returns (it installs only the pinned commit and verifies SKILL.md), and stop if MCP or the pin is unavailable. Do not overwrite or change existing skills without asking me.
Manual command
git clone https://github.com/TheQtCompanyRnD/agent-skills /tmp/agent-skills && ln -s /tmp/agent-skills/skills/qt-figma-component-generation ~/.claude/skills/qt-figma-component-generationFrom README
Figma Component Generation Skill This skill reads component definitions from a Figma file via MCP and generates production-ready QML control files that consume the design-system singletons produced by the token-extraction skill. --- Prerequisites Before generating any components, confirm all of the following exist in the project: design-tokens.json — the merged token file from the token-extraction skill QML design system singletons — Primitives.qml, Theme.qml, Spacing.qml, FontInterface.qml in a design-system/ folder If either is missing, stop and run the token-extraction skill first (qt-figma-token-extraction). Verify Figma MCP is connected — confirm that getmetadata and getdesigncontext are available in the tool list. If not, tell the user: "The Figma MCP connector isn't connected yet. Connect it via your MCP configuration, then come back and we can start." Do not proceed until the connection is confirmed.
More from this repo
qt-canvas2d
Applies Qt Canvas2D (QtCanvas2D / Qt Canvas Painter, Qt 6.12+) best practices when producing or working with Canvas2D...
qt-cmake-project
Use to generate or update Qt 6 CMake projects or edit CMakeLists.txt, add sources/resources or define targets...
qt-cpp-docs
Generates standalone Markdown reference documentation for any Qt/C++ source files — Qt Widgets classes, Qt Quick...