qt-figma-token-extraction — скилл для Claude Code: токены Figma в QML
Достаёт переменные, текстовые стили и токены из файла Figma и превращает их в design-tokens.json и готовые QML-синглтоны с общим Theme.
npx skills add TheQtCompanyRnD/agent-skills --skill qt-figma-token-extraction -a claude-codeЧто делает qt-figma-token-extraction
Скилл ведёт агента по шагам: сначала спрашивает, в каком Qt-проекте наводить порядок, потом выясняет, есть ли в файле Figma несколько режимов переменных, и только затем просит ссылки. Автоматически определяет, что в файле — Variables или Styles, и строит из них JSON-файл токенов. Для нового проекта заодно создаёт каркас: main.cpp на QGuiApplication и заглушку Main.qml.
В комплекте лежит справочник по сопоставлению типов Figma и QML, а также шаблоны пяти синглтонов: Primitives.qml, Theme.qml, FontInterface.qml, Spacing.qml, Typography.qml. Их имена и структура повторяют то, как устроен Qt Design Studio, поэтому готовые файлы потом проще переносить в существующий проект. Синглтоны прописываются в CMakeLists.txt на последнем шаге, когда список файлов уже известен.
Для проекта на Qt 6 это важно: loadFromModule() ищет Main.qml под qrc:/qt/qml/<URI>/, а старый путь qrc:/<URI>/ из Qt 5 даёт тихую ошибку загрузки. Если режимов несколько, а терминала вы избегаете, агент предложит MCP-способ с ручным переключением режимов. Нужен доступ к Figma из вашего агента: без него шаг извлечения просто не начнётся.
Какие задачи решает
- вытащить цветовую палитру и типографику из файла Figma
- получить JSON с токенами дизайн-системы
- сгенерировать QML-синглтоны под Qt Design Studio
- разложить светлую и тёмную темы на режимы переменных
- поднять каркас Qt Quick-проекта с нуля
Примеры запросов агенту
- Вытяни дизайн-токены из нашего файла Figma и сделай
design-tokens.jsonплюс QML-синглтоны - Обнови цвета в проекте по свежей версии дизайн-системы из Figma
- Перенеси переменные Figma в QML и зарегистрируй синглтоны в
CMakeLists.txt
Как установить qt-figma-token-extraction
1Через Skills CLI (Vercel)
npx skills add TheQtCompanyRnD/agent-skills --skill qt-figma-token-extraction -a claude-code2Вручную: положить файлы
~/.claude/skills/qt-figma-token-extraction/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/qt-figma-token-extraction/
1Через Skills CLI (Vercel)
npx skills add TheQtCompanyRnD/agent-skills --skill qt-figma-token-extraction -a codex2Вручную: положить файлы
.agents/skills/qt-figma-token-extraction/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add TheQtCompanyRnD/agent-skills --skill qt-figma-token-extraction -a cursor2Вручную: положить файлы
.cursor/skills/qt-figma-token-extraction/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install TheQtCompanyRnD/agent-skills qt-figma-token-extraction2Вручную: положить файлы
.github/skills/qt-figma-token-extraction/SKILL.md1Через Skills CLI (Vercel)
npx skills add TheQtCompanyRnD/agent-skills --skill qt-figma-token-extraction -a gemini-cli2Командой платформы
gemini skills install https://github.com/TheQtCompanyRnD/agent-skills --path skills/qt-figma-token-extractionВручную: положить файлы
.devin/skills/qt-figma-token-extraction/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add TheQtCompanyRnD/agent-skills --skill qt-figma-token-extraction -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о qt-figma-token-extraction
Как установить qt-figma-token-extraction в Claude Code?
Выполните npx skills add TheQtCompanyRnD/agent-skills --skill qt-figma-token-extraction -a claude-code, затем проверьте, что файл появился по пути ~/.claude/skills/qt-figma-token-extraction/SKILL.md.
Что делает qt-figma-token-extraction?
Извлекает из файла Figma переменные, текстовые стили и токены, раскладывает их в design-tokens.json и генерирует набор QML-синглтонов с единым Theme.
С какими платформами и версией Qt работает скилл?
Заявлена совместимость с Claude, Codex и GitHub Copilot, а также метаданные под Qt 6.x. Для нескольких режимов переменных понадобится терминал либо ручное переключение режимов через MCP.
