Qt Figma Component Generation

by TheQtCompanyRnD71d6c10da78bLicenseRef-Qt-Commercial OR BSD-3-ClauseListed Oct 8, 2026Updated Oct 8, 2026

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.

Only the file list is public. File contents are available once the skill is installed in a workspace.

PathSizeType
assets/qt-controls/BadgeLabel.qml4 KBtext/plain
assets/qt-controls/BadgeLabelStyle.qml3.4 KBtext/plain
assets/qt-controls/BadgeNotification.qml3.8 KBtext/plain
assets/qt-controls/BadgeNotificationStyle.qml2.7 KBtext/plain
assets/qt-controls/Button.qml5.6 KBtext/plain
assets/qt-controls/ButtonStyle.qml8.2 KBtext/plain
assets/qt-controls/Card.qml22.6 KBtext/plain
assets/qt-controls/CardStyle.qml4.4 KBtext/plain
assets/qt-controls/CheckBox.qml4.2 KBtext/plain
assets/qt-controls/CheckBoxStyle.qml5.4 KBtext/plain
assets/qt-controls/ComboBox.qml7.1 KBtext/plain
assets/qt-controls/ComboBoxStyle.qml6.8 KBtext/plain
assets/qt-controls/DialogButtonBox.qml2 KBtext/plain
assets/qt-controls/DialogButtonBoxStyle.qml1.2 KBtext/plain
assets/qt-controls/Dialog.qml4.2 KBtext/plain
assets/qt-controls/DialogStyle.qml2.1 KBtext/plain
assets/qt-controls/IconButton.qml4 KBtext/plain
assets/qt-controls/IconButtonStyle.qml4.6 KBtext/plain
assets/qt-controls/Indicator.qml2.2 KBtext/plain
assets/qt-controls/IndicatorStyle.qml1.5 KBtext/plain
assets/qt-controls/ItemDelegate.qml2.7 KBtext/plain
assets/qt-controls/ItemDelegateStyle.qml2.4 KBtext/plain
assets/qt-controls/Label.qml1.4 KBtext/plain
assets/qt-controls/LabelStyle.qml1.2 KBtext/plain
assets/qt-controls/LinkInline.qml1.9 KBtext/plain
assets/qt-controls/LinkInlineStyle.qml1.4 KBtext/plain
assets/qt-controls/LinkList.qml2.4 KBtext/plain
assets/qt-controls/LinkListStyle.qml1.7 KBtext/plain
assets/qt-controls/LinkStandalone.qml2.4 KBtext/plain
assets/qt-controls/LinkStandaloneStyle.qml1.6 KBtext/plain
assets/qt-controls/ListItem.qml6.3 KBtext/plain
assets/qt-controls/ListItemStyle.qml2.9 KBtext/plain
assets/qt-controls/MenuButton.qml4.4 KBtext/plain
assets/qt-controls/MenuButtonStyle.qml3 KBtext/plain
assets/qt-controls/MenuItem.qml2.7 KBtext/plain
assets/qt-controls/MenuItemStyle.qml1.4 KBtext/plain
assets/qt-controls/Menu.qml1.9 KBtext/plain
assets/qt-controls/MenuStyle.qml1.2 KBtext/plain
assets/qt-controls/PaginationDot.qml2.6 KBtext/plain
assets/qt-controls/PaginationDotStyle.qml2.2 KBtext/plain
assets/qt-controls/PaginationIndex.qml2.2 KBtext/plain
assets/qt-controls/PaginationIndexStyle.qml1.4 KBtext/plain
assets/qt-controls/PaginationNumber.qml10.7 KBtext/plain
assets/qt-controls/PaginationNumberStyle.qml3.5 KBtext/plain
assets/qt-controls/Popup.qml1.4 KBtext/plain
assets/qt-controls/PopupStyle.qml1 KBtext/plain
assets/qt-controls/ProgressBar.qml3.1 KBtext/plain
assets/qt-controls/ProgressBarStyle.qml1.5 KBtext/plain
assets/qt-controls/RadioButton.qml3 KBtext/plain
assets/qt-controls/RadioButtonStyle.qml3 KBtext/plain
assets/qt-controls/RangeSlider.qml5 KBtext/plain
assets/qt-controls/RangeSliderStyle.qml3.7 KBtext/plain
assets/qt-controls/ScrollBar.qml2.6 KBtext/plain
assets/qt-controls/ScrollBarStyle.qml3.3 KBtext/plain
assets/qt-controls/SearchField.qml6 KBtext/plain
assets/qt-controls/SearchFieldStyle.qml4 KBtext/plain
assets/qt-controls/SearchMenu.qml14.6 KBtext/plain
assets/qt-controls/SearchMenuStyle.qml4.7 KBtext/plain
assets/qt-controls/Slider.qml3.8 KBtext/plain
assets/qt-controls/SliderStyle.qml3.8 KBtext/plain
assets/qt-controls/SortFilterModel.qml1.6 KBtext/plain
assets/qt-controls/SpinBox.qml5.8 KBtext/plain
assets/qt-controls/SpinBoxStyle.qml3.5 KBtext/plain
assets/qt-controls/Switch.qml3.5 KBtext/plain
assets/qt-controls/SwitchStyle.qml3 KBtext/plain
assets/qt-controls/TabBar.qml2 KBtext/plain
assets/qt-controls/TabBarStyle.qml886 Btext/plain
assets/qt-controls/TabButton.qml4.3 KBtext/plain
assets/qt-controls/TabButtonStyle.qml4.2 KBtext/plain
assets/qt-controls/Tag.qml4.4 KBtext/plain
assets/qt-controls/TagStyle.qml3.1 KBtext/plain
assets/qt-controls/TextField.qml7 KBtext/plain
assets/qt-controls/TextFieldStyle.qml4.6 KBtext/plain
assets/qt-controls/Toolbar.qml1.5 KBtext/plain
assets/qt-controls/ToolbarStyle.qml1 KBtext/plain
assets/qt-controls/ToolTip.qml7.4 KBtext/plain
assets/qt-controls/ToolTipStyle.qml2.2 KBtext/plain
assets/qt-controls/TreeViewDelegate.qml4.3 KBtext/plain
assets/qt-controls/TreeViewDelegateStyle.qml2.8 KBtext/plain
README.md4.2 KBtext/markdown
references/Button.qml11.5 KBtext/plain
references/Checkbox.qml7.1 KBtext/plain
references/Select.qml9.7 KBtext/plain
references/TextField.qml7.2 KBtext/plain
references/Toggle.qml4.6 KBtext/plain
SKILL.md16.3 KBtext/markdown

Source and attribution

Source:TheQtCompanyRnD/agent-skillsinskills/qt-figma-component-generationat commit71d6c10

License: LicenseRef-Qt-Commercial OR BSD-3-Clause

Content belongs to its original authors. SourceWeft indexes it from a public repository.

Report or request removal

More from TheQtCompanyRnD/agent-skills

Qt Ui Design

TheQtCompanyRnD

Guides UI and UX design or audits for Qt/QML, web, and embedded targets using design principles and WCAG checks.

Design & CreativeOct 8, 2026

Qt Qml Test

TheQtCompanyRnD

Generates Qt Quick Test QML unit test files for QML components.

Software DevelopmentOct 8, 2026

Qt Qml Profiler

TheQtCompanyRnD

Use when the user is investigating QML / Qt Quick performance — both vague complaints ("the UI feels laggy", "this is slow", "frames are dropping", "the app stutters") and explicit asks to profile, find hotspots, or optimize bindings, signals, or rendering. Runs qmlprofiler on a 2D QML application, parses the .qtd trace, and analyzes hotspots against the source with frame-time, memory, and pixmap-cache summaries. Does NOT cover Qt Quick 3D.

Includes scripts
Awaiting classificationOct 8, 2026

Qt Qml Docs

TheQtCompanyRnD

Generates standalone Markdown reference documentation for QML components and applications. Use this skill whenever you want to document QML files, create API reference docs for a QML component or module, document a Qt Quick application, or produce developer-facing documentation from .qml source code. Triggers on: "document this QML", "write docs for my QML", "create reference docs", "document QML component", "QML API docs", "document my Qt Quick component", "document my Qt app", or any time one or more .qml files are provided and documentation is needed. Works with single files, pasted code, or entire project folders. DO NOT use if the user asks for QDoc format output.

Awaiting classificationOct 8, 2026

Qt Qml

TheQtCompanyRnD

Applies QML best practices when producing or working with QML source code. Use whenever QML code is the primary subject: writing, reviewing, fixing, refactoring, optimizing, or debugging QML files, components, or bindings. Do NOT trigger for purely conversational QML questions where no code is produced or examined (e.g. "explain how anchors work").

Awaiting classificationOct 8, 2026

Qt Figma Token Extraction

TheQtCompanyRnD

Extracts design tokens from Figma and generates a design-tokens.json plus QML singleton files for a Qt project.

Design & CreativeOct 8, 2026