# Toolcraft

Toolcraft is a starter kit and UI library from [Pixel Point](https://pixelpoint.io/) for building small visual-tool apps by describing them to a coding agent. You run the CLI, pick an agent, open the generated folder in it, and say what you want:

```
npx @pixel-point/toolcraft create
```

```
Build an app that applies an ASCII effect to an uploaded image.
```

The target shape is narrow and stated as such: apps that pair a canvas with a focused set of controls. Procedural graphics and gradient generators, image stylization (ASCII, pixel, halftone, glitch), shader and Three.js experiments, animation and video-effect tools, blog-cover and branded-asset generators.

## The design decision worth noting

Most agent-facing UI kits ship components and let the agent assemble an application around them. Toolcraft ships the application and lets the agent fill in the product. The generated project already contains a canvas with upload, pan, zoom, radar and history; a controls panel; a toolbar; and optional layer, timeline and keyframe systems that get wired up only when the tool needs them. The checked-in starter is deliberately neutral — it starts as an empty tool, not as a demo you delete.

The second decision is that nothing is hidden behind a package. `src/toolcraft/runtime` (state, commands, canvas, panels, timeline, export) and `src/toolcraft/ui` (controls and interface components) are vendored into each generated project as editable source. An agent that needs to change the runtime can change the runtime, which is the difference between a starter kit and a framework the agent has to work around.

The layout, in full:

- `src/app` — product schema, acceptance coverage, performance configuration
- `src/routes` — routes and Toolcraft composition
- `src/toolcraft/runtime`, `src/toolcraft/ui` — the vendored library
- `docs/toolcraft` — local rules and reference docs written for agents
- `e2e` — browser acceptance and performance tests

## The gates

The part that distinguishes this from a template is that the project ships with checks the agent is expected to run:

```
npm run test          # unit and contract checks
npm run verify:quick  # normal development checks
npm run verify:final  # complete functional gate
```

Unit, browser, acceptance and performance checks are present from the first commit, alongside the `docs/toolcraft` rules and performance instructions the vendor calls "embedded AI skills." That combination — a fixed architecture, written rules, and a deterministic gate the agent can run itself — is exactly the setup [[benchmarking-opus-5-slopcodebench]] identifies as the untested variable in its own results: that benchmark ran models with a bare solve prompt and no quality feedback in the loop, and its author expects deterministic backpressure to change the outcome. Toolcraft is a small commercial bet on the same hypothesis. It is also a clean instance of [[scaffold-model-fit]]: the scaffold takes over the decisions the agent is worst at (application structure, performance discipline, what "done" means) so the model only has to supply the part it is good at.

Works with any agent — the README names Codex, [[claude-code|Claude]], and Cursor, and nothing in the setup is agent-specific beyond which rules file the CLI writes.

## Limitations

The landing page at toolcraft.sh is marketing and contains almost nothing the repo README does not say better; "you're only limited by your creativity" and "design the outcome, not the workspace" are the entire copy. Take the README as the source.

Beyond that, the constraints are the ones implied by the design. It is React and TypeScript only. It is for canvas-plus-controls apps, and an app that is not that shape inherits an architecture built for a different problem. The runtime being vendored means generated projects do not get upstream fixes; each one forks at creation. And the value of the whole thing rests on the quality of the `docs/toolcraft` rules and the acceptance checks, none of which the README quantifies — there is no published comparison of agent output with and without the scaffold.

Repo: https://github.com/pixel-point/toolcraft (MIT). The clip carries no star count. Background and example projects are in [Pixel Point's write-up](https://pixelpoint.io/blog/how-to-craft-personal-design-tools-with-toolcraft/).
