Toolcraft – open-source AI harness and starter for building design apps logo

Toolcraft – open-source AI harness and starter for building design apps

Show HN: Toolcraft – 開源 AI 框架與入門模板,用於構建設計類應用

訪問官網

工具概覽

Toolcraft 是一個開源的入門套件和 UI 庫,用於藉助 AI 構建自定義設計應用。它適用於任何 AI 智慧體,例如 Codex、Claude 或 Cursor。入門應用使用 TanStack Router、React、TypeScript、Tailwind CSS 和 Base UI 構建,包含帶平移和縮放控制的畫布,以及元件庫,其中有按鈕、下拉選單、滑塊、字型選擇器、調色盤、曲線編輯器、圖片上傳器等。它還提供內建的圖層、動畫時間線和關鍵幀,智慧體可按需啟用,並提供影像和影片匯出工作流。AI 框架為智慧體提供技能、指令和檢查,使其能在 Toolcraft 的設計系統之上構建,套件還包含單元、瀏覽器、驗收和效能檢查。應用背後的所有程式碼都可以交給 AI 智慧體隨意定製。Toolcraft 不是雲服務;它是一批檔案,在使用命令列工具或請智慧體操作時被複制到你選擇的資料夾中。生成的應用可以獨立執行,並可部署到 Cloudflare、Vercel 或 Netlify 等網路主機。

定價

目錄尚未確認完整價格方案,請至官網查看目前額度、限制及計費方式。

訪問官網

價格與限制可能變動,請以官網為準,並確認幣別、付款週期、最低席位數和用量上限。

應用場景

  • 團隊用 Toolcraft 構建程式化圖形和漸變生成器。
  • 團隊用 Toolcraft 建立影像風格化工具,包括 ASCII、畫素、半調和故障效果。
  • 團隊用 Toolcraft 進行著色器和 Three.js 實驗。
  • 團隊用 Toolcraft 構建動畫和影片特效工具。
  • 團隊用 Toolcraft 生成部落格封面和品牌素材。

功能特色

可定製的設計應用起步專案

支援平移和縮放的畫布

現成的設計操作控制元件

圖層管理元件

動畫時間線與關鍵幀

圖片和影片匯出流程

供 AI Agent 使用的開發指引與檢查項

使用者評論

還沒有評論,來分享你的使用體驗吧

常見問題

Why would I use Toolcraft instead of Figma?

Use Toolcraft only when a custom app would solve your task faster or better than Figma or another design tool. First consider what your existing software can do, including its AI features, and account for the time needed to build the app. For example, managing hundreds of small layers and repeatedly applying effects or adjustments can become cumbersome in Figma. With a custom app, you decide which controls and parameters to include, how the design responds to them, and which export options you need, including video. You can build a repeatable workflow for producing consistent brand assets in batches, then keep expanding it as your ideas evolve. You can also share the app with your client so they can create new assets on their own.

How long does it take to generate an app?

It depends on what you want to build. You can usually expect a first working result 30–60 minutes after your initial prompt. More complex tasks, such as reverse engineering a reference, combining multiple WebGL effects, or building 3D tools, can take longer. Toolcraft isn’t a magic tool that lets you create anything instantly. It gives you the workspace, AI guardrails, and skills to make the process smoother and improve your chances of getting the result you want. At Pixel Point, we often spend 1–3 days on a single app and go through 30–50 iterations with AI, sometimes more, before reaching a version that matches what we envisioned.

Where can I find my generated app?

Toolcraft uses port 3002 for the local development environment by default. If it’s busy on the first launch, it picks the next available port and remembers it for your project. After creating the app, your AI agent will usually give you a URL like http://localhost:3002 that you can open in your browser. If it doesn’t, simply ask your agent to start the dev server or give you the local URL.

Is a $20/month Codex, Cursor, or Claude plan enough to build an app?

No. In general, $20/month plans aren’t suitable for meaningful work. Use a plan that costs at least $100/month.

Is Toolcraft an application or a cloud service?

No. It’s a batch of files copied into a folder of your choice when you use the command-line tool or ask an agent to do it for you. Those files contain the starter, component library, and AI harness that help you build your own design apps faster and better.

Is Toolcraft free?

Yes. Toolcraft is completely free, open-source software licensed under MIT. You’re free to use it in commercial projects, modify it, and distribute it to your clients.

Can I use apps built with Toolcraft for commercial projects and client work?

Yes. The starter in this repository uses the MIT license, which allows commercial use, modification, and distribution. You can build tools for paid client work and use them in your business.

Which AI agents can I use with Toolcraft?

You can use Codex, Claude Code, Cursor, or another coding agent that can read and edit project files, run commands, and follow the project's instructions. Open the project in your agent and describe what you want to build. Toolcraft includes instructions and skills to guide the work.

Can I start from an existing example instead of building from scratch?

Yes. Browse the example apps, open the one you want to start from, and click Clone with CLI on its page to copy the setup command. Ask your agent to run it, or paste it into your terminal. For example: npx @pixel-point/toolcraft@latest create --template prism-flow. Your new project starts with that example's design and features, which you can then change with your agent.

Can I publish my app and share it with teammates or clients?

Yes. Your agent can prepare the app for publishing and help you deploy it to a web host of your choice. It can run pretty much anywhere and can be easily deployed to Cloudflare, Vercel, or Netlify.

相關榜單與專題