Create Forms with File Upload in Framer

Let visitors attach documents, images or photos through a form on a Framer site, with the file limits and where the attachments end up.

Framer is a good place to design a site, but its form component has no file input. If a visitor needs to send a CV, a screenshot or a photo, the form has to come from somewhere else. A Tinyform form with a File upload question embeds in Framer with one snippet, and the upload works inside the frame exactly as it does on the form's own page.

Create a form with a file upload

In the editor at /forms/<id>/edit, type / on an empty line and pick File upload. The block's settings hold Multiple files, Min files and Max files, Max size (MB) and Allowed files, which restricts the upload to certain types. File upload forms goes through each of them.

What a respondent attaches is stored in a private bucket with no public address. The files are reachable only from the form's Submissions tab, one at a time on each row or all together as a ZIP. File upload forms describes the downloads.

Embed the form in Framer

Publish and copy the snippet
Press Publish, open the Share tab, choose Embed Form and press Get the code on the Standard embed.
Paste it into Framer
Insert an Embed component in Framer, set it to HTML and paste the snippet. Or press Copy embed link and give the component the URL.
Publish the site
Publish in Framer. Uploads go straight from the visitor's browser to your Tinyform install; the Framer page never handles the bytes.

Embed forms on Framer walks through the Framer side with screenshots.

Send the submissions on

Once the files are arriving, decide where the rest of the answer should go. A webhook posts each submission to an address of your choosing as it is made, and the REST API reads them back. Direct connections to the tools below are on the way; the Integrations section shows what is live today.