Building and importing

Ways in

On the New drop page (/new) the maker drops a file or a whole folder (or clicks "browse files"), or lets a connected AI send the tool. Accepted files: .html, .htm, .jsx, .tsx, .js, .mjs, .vue, .css, .txt, .zip and .pdf. A dropped folder is packed in the browser and handled like a ZIP. Most tools arrive as code generated by an AI assistant (ChatGPT, Claude, Gemini and similar). A connected AI can also create a drop directly, from one code file or from the files of a static website (see Connecting your own AI); on /new the maker copies one sentence for the AI, and the page shows the tool as soon as it arrives. The same scan and limits apply; one request from an AI can be about 4 MB.

/new works in steps:

1. Add: the file, folder or AI.
2. Check: the name (taken from the page title or the file name) and what the scan found, in plain words. If the maker already has a drop with the same name, /new offers to publish the file as a new version of that drop instead of making a second one. "Put it live" creates the drop, always Private.
3. Connect (only for a tool that saves submissions): keep the submissions in Toolcrow, or send them to a Google Sheet.
4. Share: only the maker, link and password, or anyone with the link. Opening it to anyone asks for a confirmation. A tool that shows submissions back to visitors also gets the switch "Visitors can read submissions", off by default.

After the last step the maker lands on the drop page, where everything can be changed later.

How each type runs

• HTML: served exactly as written. This is the most predictable format.
• React component (JSX or TSX): Toolcrow wraps it in a page that loads React 18 and compiles the component in the browser. Tailwind CSS is available. Imports of npm packages (for example lucide-react or recharts) are loaded automatically from a CDN. The component that is exported by default, or a component named App, is rendered.
• Vue component: loaded with Vue 3, and the App component is mounted.
• Plain JavaScript or CSS: wrapped in a page, with Tailwind CSS available.
• ZIP file: a static website bundle (HTML, CSS, JavaScript, images, fonts and similar). It needs an HTML entry page; an index.html closest to the top of the ZIP is preferred. Only static file types are kept, other files are skipped.
• PDF: shown in a built-in PDF viewer.
• PowerPoint (.pptx): new uploads are no longer accepted (exporting the slides to PDF works). Existing PowerPoint drops keep working.
• Markdown is not an input format.

Language

Toolcrow's frame around a drop (badge, share panel, feedback button, password screen) is in English or Dutch and follows the lang on the tool's <html> tag. An HTML tool in Dutch that starts with <html lang="nl"> gets a Dutch frame. React, Vue and plain JavaScript are wrapped in a page without a language, so there the frame follows the visitor's browser (see What a drop is).

Size limits

• Pasted code: up to 500,000 characters.
• One uploaded code or HTML file: up to 10 MB.
• ZIP: up to 10 MB compressed, at most 60 files, 8 MB unpacked in total, and 5 MB per file.
• PDF: up to 25 MB.

When a connected AI creates a drop, it writes out the whole tool in one message. How long one message can be depends on the AI app and the plan, and is usually well below the limits above. A very large single file, for example one with libraries, fonts or images built in, therefore goes in by uploading it on the New drop page (/new), which takes files up to 10 MB. Updates to a large drop work through a connected AI as usual: it reads the code in parts and sends only the changes (see Connecting your own AI).

The scan

Every drop is scanned when it is deployed. "How it's built" on the drop page (open Connections, or the "How it's built" link when the tool talks to no other services) shows the result: what kind of tool it is, its libraries with their versions, what it uses (shared data, AI, outside services, knowledge files, MCP actions, browser storage) and a verdict on whether it will run on Toolcrow. Only the parts the tool uses get a row; the rest is listed on one line. Code that needs a server of its own, such as a Node project with a build step (package.json, Vite or webpack config), PHP, Express, Flask or code that starts a web server, is deployed but marked as not able to run, because a drop has no server.

Automatic adjustment after deploy

After the first deploy of a single-file drop, Toolcrow checks whether the tool is interactive but forgets everything on refresh (data only held in memory). If so, Toolcrow can rewrite only the saving and loading points so the data is kept per visitor in the browser (localStorage). The change is checked automatically: when it passes it is applied quietly, otherwise it is offered to the maker on the drop page. It never turns a tool into one that collects or shares data between visitors; that remains the maker's choice (see Saving data).

New versions

The drop page has an "Upload new version" action, in the Versions panel that opens from the version line at the top. The new code replaces the old code at the same link and the version number goes up by one. The name, description, password and visibility stay as they were. The previous version is kept as a backup (see Versions, backups and drafts). A connected AI can also prepare a new version as a draft (see Connecting your own AI).