vetta-ui-design

Pick the product type (mobile, desktop, landing, slide, poster) and call vetd_create, then write one TSX file per frame in the frames/ directory. Each file name becomes its route and frame id, and every save hot-reloads the canvas automatically.

Write a new file like frames/settings.tsx with a frame meta line declaring width, height, and title. The file name is the route, so no registration step exists; the design.json manifest is regenerated from your TSX declarations on every save.

Yes, vetd_install adds packages to the design's own package.json, including @fontsource typefaces. Icon packages, CSS frameworks, and routers are banned because Iconify, Tailwind v4, and react-router are already built in.

Blank rendering usually means a Tailwind class references a theme token never defined in theme.css, or an icon name outside the offline sets (lucide, tabler, mdi, simple-icons). Run vetd_screenshot and check the reported issues for the exact file and line.

Do not use vetd_* tools for ordinary front-end work in the user's own codebase; building or restyling pages of a real app belongs to that repository. The canvas rules apply only inside .vetd design documents.

Call vetd_export with format pdf for a single multi-page file or format images for one PNG per frame. Export only the format the user requested, and use vetd_screenshot rather than export when you need to verify a design visually.