{"enrichment":{"faq":[{"a":"Qt Figma Component Generation transforms Figma components into idiomatic Qt Quick Controls by extracting design metadata via MCP and mapping variants, states, and tokens to QML. The skill supports two implementation patterns: inline self-contained components or style singletons for multi-theme support, and requires the design-tokens.json output from the token-extraction skill.","q":"How does Qt Figma Component Generation convert Figma mockups to Qt?"},{"a":"Yes. Qt Figma Component Generation automates the creation of Qt components directly from your Figma designs. It extracts design metadata, maps component variants and states to QML, and generates idiomatic Qt Quick Controls code ready for integration into your application.","q":"Can I generate Qt components automatically from Figma designs?"},{"a":"Qt Figma Component Generation is a Figma-to-Qt code generator that streamlines designer-to-developer handoff. It extracts design tokens and component metadata from Figma, then automatically generates QML code that maps to Qt Quick Controls, supporting both single-component and multi-theme singleton patterns.","q":"What is a Figma to Qt code generator and how does it work?"},{"a":"Yes. Qt Figma Component Generation enables direct export of Qt UI code from Figma designs. It uses MCP to extract design metadata and generates QML that maps variants, states, and design tokens to Qt Quick Controls, supporting inline components or style singletons for theme management.","q":"Can Qt Figma Component Generation export Qt UI code directly from Figma?"},{"a":"Qt Figma Component Generation works with two patterns: inline self-contained components for single-use cases, and style singletons for multi-theme support. Both patterns map Figma design tokens, variants, and states to idiomatic Qt Quick Controls code.","q":"What implementation patterns does Qt Figma Component Generation support?"},{"a":"Qt Figma Component Generation requires the design-tokens.json output from the token-extraction skill. This file provides the design tokens that the skill maps to QML, ensuring consistent styling across your generated Qt components.","q":"What dependencies does Qt Figma Component Generation require?"}],"shadow_tags":["design-to-code","ui-automation","cross-platform-dev","figma-integration","code-generation","component-library","rapid-prototyping","designer-developer-workflow"],"summary_rewrite":"This skill transforms Figma components into idiomatic Qt Quick Controls by extracting design metadata via MCP and mapping variants, states, and tokens to QML. It works with two implementation patterns\u2014inline self-contained components or style singletons for multi-theme support\u2014and requires the design-tokens.json output from the token-extraction skill."},"gist":{"api_url":"https://skillfed.io/api/skills/TheQtCompanyRnD/agent-skills/qt-figma-component-generation.json","as_of":"2026-07-09","description":"Qt Figma Component Generation automates QML control creation from Figma design systems using MCP extraction.","install":{"manual":["git clone https://github.com/TheQtCompanyRnD/agent-skills","cp -r agent-skills ~/.claude/skills/qt-figma-component-generation"],"primary":"npx skillfed install TheQtCompanyRnD/agent-skills/qt-figma-component-generation","version":"3d1db299"},"kind":"skill","mirror_url":"https://skillfed.io/TheQtCompanyRnD/agent-skills/qt-figma-component-generation.md","similar":[{"id":"TheQtCompanyRnD/agent-skills/qt-figma-token-extraction","name":"Qt Figma Token Extraction","publisher":"TheQtCompanyRnD/agent-skills","url":"https://skillfed.io/TheQtCompanyRnD/agent-skills/qt-figma-token-extraction"},{"id":"TheQtCompanyRnD/agent-skills/qt-qml","name":"Qt Qml","publisher":"TheQtCompanyRnD/agent-skills","url":"https://skillfed.io/TheQtCompanyRnD/agent-skills/qt-qml"},{"id":"TheQtCompanyRnD/agent-skills/qt-ui-design","name":"Qt Ui Design","publisher":"TheQtCompanyRnD/agent-skills","url":"https://skillfed.io/TheQtCompanyRnD/agent-skills/qt-ui-design"},{"id":"TheQtCompanyRnD/agent-skills/qt-cmake-project","name":"Qt Cmake Project","publisher":"TheQtCompanyRnD/agent-skills","url":"https://skillfed.io/TheQtCompanyRnD/agent-skills/qt-cmake-project"},{"id":"TheQtCompanyRnD/agent-skills/qt-qml-test-run","name":"Qt Qml Test Run","publisher":"TheQtCompanyRnD/agent-skills","url":"https://skillfed.io/TheQtCompanyRnD/agent-skills/qt-qml-test-run"}],"title":"Qt Figma Component Generation by TheQtCompanyRnD \u2014 SkillFed","use":{"when":["Yes.","Qt Figma Component Generation is a Figma-to-Qt code generator that streamlines designer-to-developer handoff."]},"what":{"lead":"Qt Figma Component Generation automates QML control creation from Figma design systems using MCP extraction and token mapping.","rest":"This skill transforms Figma components into idiomatic Qt Quick Controls by extracting design metadata via MCP and mapping variants, states, and tokens to QML. It works with two implementation patterns\u2014inline self-contained components or style singletons for multi-theme support\u2014and requires the design-tokens.json output from the token-extraction skill."}},"id":"TheQtCompanyRnD/agent-skills/qt-figma-component-generation","install":{"mode":"external","repo":"https://github.com/TheQtCompanyRnD/agent-skills"},"links":{"html":"https://skillfed.io/TheQtCompanyRnD/agent-skills/qt-figma-component-generation","md":"https://skillfed.io/TheQtCompanyRnD/agent-skills/qt-figma-component-generation.md","repo":"https://github.com/TheQtCompanyRnD/agent-skills"},"meta":{"agents_supported":[],"first_seen":"2026-07-28","forks":34,"language":"QML","last_updated":"2026-07-09","license":"NOASSERTION","name":"Qt Figma Component Generation","publisher":"TheQtCompanyRnD","stars":322},"relations":{"similar":[{"id":"TheQtCompanyRnD/agent-skills/qt-figma-token-extraction"},{"id":"TheQtCompanyRnD/agent-skills/qt-qml"},{"id":"TheQtCompanyRnD/agent-skills/qt-ui-design"},{"id":"TheQtCompanyRnD/agent-skills/qt-cmake-project"},{"id":"TheQtCompanyRnD/agent-skills/qt-qml-test-run"},{"id":"TheQtCompanyRnD/agent-skills/qt-qml-test"},{"id":"TheQtCompanyRnD/agent-skills/qt-qml-docs"},{"id":"TheQtCompanyRnD/agent-skills/qt-qml-profiler"},{"id":"TheQtCompanyRnD/agent-skills/qt-qml-review"},{"id":"beefiker/superloopy/superloopy-frontend"}]},"slug":{"owner":"TheQtCompanyRnD","repo":"agent-skills","skill":"qt-figma-component-generation"},"version":"3d1db299"}