# qt-ui-design

> Claude/Codex skill by [@theqtcompanyrnd](https://omgskills.com/library/theqtcompanyrnd/index.md) · 498 stars · Updated 2026-10-20

Design or audit UI for Qt/QML, Qt projects, web, or embedded MPU or MCU targets. Use when creating screens, layouts, navigation, or auditing UX.

Tags: ai-skills, claude-code, codex, github-copilot, qml, qt

## Install

```sh
git clone https://github.com/TheQtCompanyRnD/agent-skills /tmp/agent-skills && ln -s /tmp/agent-skills/skills/qt-ui-design ~/.claude/skills/qt-ui-design
```

## From README

Qt UI Design Before producing UI output, confirm you know: target platform, screen geometry, design system, content priority, viewing distance, locale, and input methods. Run the seven items below as a check against the conversation and the project state; ask only the items that are genuinely missing. When the user cannot answer an item, choose a sensible Qt default and name it in your response so the user can correct it. Small edits to an existing design — for example "move the OK button to the right", "change this label", "make this red" — do not trigger the checklist. Apply section 1 silently and verify section 2 (contrast, hit-target) where relevant. Context check (before designing) Use the seven items below to decide what is already known and what to ask. If the conversation or repository has already answered an item, do not re-ask. Target platform — Desktop, web browser, mobile, or specific hardware (MCU, Raspberry Pi, other embedded board)?

## Links

- HTML page: https://omgskills.com/library/theqtcompanyrnd/agent-skills/skills/qt-ui-design/
- GitHub: https://github.com/TheQtCompanyRnD/agent-skills
- Author: [@theqtcompanyrnd](https://omgskills.com/library/theqtcompanyrnd/index.md)

## More from this repo

- [qt-canvas2d](https://omgskills.com/library/theqtcompanyrnd/agent-skills/skills/qt-canvas2d/index.md) — Applies Qt Canvas2D (QtCanvas2D / Qt Canvas Painter, Qt 6.12+) best practices when producing or working with Canvas2D...
   - [@theqtcompanyrnd](https://omgskills.com/library/theqtcompanyrnd/index.md) · 498 stars
- [qt-cmake-project](https://omgskills.com/library/theqtcompanyrnd/agent-skills/skills/qt-cmake-project/index.md) — Use to generate or update Qt 6 CMake projects or edit CMakeLists.txt, add sources/resources or define targets...
   - [@theqtcompanyrnd](https://omgskills.com/library/theqtcompanyrnd/index.md) · 498 stars
- [qt-cpp-docs](https://omgskills.com/library/theqtcompanyrnd/agent-skills/skills/qt-cpp-docs/index.md) — Generates standalone Markdown reference documentation for any Qt/C++ source files — Qt Widgets classes, Qt Quick...
   - [@theqtcompanyrnd](https://omgskills.com/library/theqtcompanyrnd/index.md) · 498 stars