tesseract-editor — Claude Code skill for .tsrct editors
Build or change a browser-based editor for Tesseract .tsrct projects. The skill covers interface controls, previews, and saving project data.
npx skills add mirage-hq/Tesseract --skill tesseract-editor -a claude-codeWhat tesseract-editor does
This skill guides an agent through building a web app that opens and edits .tsrct projects. A static HTML app can use the browser engine directly, with its runtime files beside the page. The app handles its own controls, selection, and playback; the engine exposes the actions it supports.
Saving with toBlob() packages the document and its original assets into a Blob, but does not write a file to disk. A page refresh drops unsaved changes. Overwriting the source file can disrupt later reads of its assets, so the saved-Blob reopening flow matters.
The editor needs HTTP file serving and browser support for GPU and media. Keep the runtime’s JavaScript, type definitions, and WASM from the same release, and check the archive checksum. The browser engine cannot export video. Direct project authoring belongs to the motion or video skill.
What it helps with
- build a browser editor for
.tsrctprojects - add layer controls and project previews
- package a project with its original assets
- investigate runtime versions and file compatibility
Example prompts for the agent
- Build a browser editor for this
.tsrctproject with a preview and save flow. - Add layer controls and object selection to the editor.
- Check why an older
.tsrctopens or renders differently after a runtime update.
How to install tesseract-editor
1Skills CLI (Vercel)
npx skills add mirage-hq/Tesseract --skill tesseract-editor -a claude-code2Manually: put the files in place
~/.claude/skills/tesseract-editor/SKILL.mdCopy the whole skill folder; for one project use .claude/skills/tesseract-editor/
1Skills CLI (Vercel)
npx skills add mirage-hq/Tesseract --skill tesseract-editor -a codex2Manually: put the files in place
.agents/skills/tesseract-editor/SKILL.mdFor all projects use ~/.agents/skills/
1Skills CLI (Vercel)
npx skills add mirage-hq/Tesseract --skill tesseract-editor -a cursor2Manually: put the files in place
.cursor/skills/tesseract-editor/SKILL.mdCursor also reads .agents/skills/ and .claude/skills/
1GitHub CLI
gh skill install mirage-hq/Tesseract tesseract-editor2Manually: put the files in place
.github/skills/tesseract-editor/SKILL.md1Skills CLI (Vercel)
npx skills add mirage-hq/Tesseract --skill tesseract-editor -a gemini-cli2Platform CLI
gemini skills install https://github.com/mirage-hq/Tesseract --path skills/tesseract-editorManually: put the files in place
.devin/skills/tesseract-editor/SKILL.mdThe legacy .windsurf/skills/ path still works
Skills CLI (Vercel)
npx skills add mirage-hq/Tesseract --skill tesseract-editor -a opencodeClaude.ai
Zip the folder and upload it in Settings → Capabilities → Skills
Step by step, with commands for each platform: How to install skills in Claude Code: five ways
Questions about tesseract-editor
How do I install tesseract-editor in Claude Code?
Run npx skills add mirage-hq/Tesseract --skill tesseract-editor -a claude-code. The skill file is installed at ~/.claude/skills/tesseract-editor/SKILL.md.
What does tesseract-editor do?
It guides browser-editor work for Tesseract .tsrct projects, including interface controls, previews, and saving.
What does a Tesseract browser editor need to run?
Serve its files over HTTP, and use a browser with GPU and media support. The runtime’s JavaScript, type definitions, and WASM must come from the same release.
