How Do I Add a File Upload Field to a Webflow Form?

How do I let people upload a file through my Webflow form?

You add a File upload field to your Webflow form, and visitors can then attach a file when they submit. Webflow gives you a built-in upload button for this, so you do not need custom code. You do need the right site plan, and there are limits worth knowing before you start.

I set this up often for clients who need resumes, briefs, design files, or documents sent through their site. Done right, it saves a lot of back and forth email. Done wrong, it fails silently and you lose leads without knowing why.

This guide walks through the whole thing in plain steps. I will cover the plan you need, how to add the field, the file limits, and how to route the uploaded files where you actually want them.

What is the file upload field in Webflow?

The file upload field is a built-in Webflow form element that lets a visitor attach a file to their form submission. It shows up as an upload button on your form. When someone submits, the file is stored by Webflow and linked to that submission, so you can download it later.

It works like any other form input, such as a name or email field. You drag it into your form, give it a label, and set whether it is required. The difference is that it handles a real file, not just text.

This is a native feature, which is the part people miss. You do not need a third-party widget or a script for the basic case. Webflow handles the upload, the storage, and the link to the submission on its own.

Which Webflow plan do I need for file uploads?

You need a paid site plan that includes file uploads. According to Webflow's Help Center, the File upload button is available on the Premium Site plan, the legacy Business Site plan, and the Ecommerce Plus and Ecommerce Advanced plans. It is not part of the free or lower tiers.

This trips people up more than anything else. They add the field on a free site, test it, and the upload does not work. The field exists in the Designer, but the upload only functions once the site is on a qualifying paid plan and published.

So before you build, check your plan. If you are on a starter plan and file uploads are core to your business, budgeting for the Premium plan is the first real step. There is no clean free workaround for the native feature.

How do I add a file upload field to my form, step by step?

You add it from the Add panel in the Webflow Designer, drop it inside your form, then style and label it. The whole process takes a couple of minutes once your form exists. Here is the flow I follow every time.

First, open the page and click into the form block where you want the upload. Next, open the Add panel and find the File upload element under the form components, then drag it inside the form, above the submit button. After that, select the new field and give it a clear label in the settings, such as "Upload your brief," so people know what to send.

Then decide if the field should be required. If a submission is useless without the file, mark it required so the form will not send without one. Finally, publish your site and test the form yourself by uploading a real file. A live test on the published site is the only way to be sure it works, because it will not work on a free preview. Good form microcopy on your labels and buttons makes a big difference to how many people finish.

What file types and sizes does Webflow allow?

Webflow accepts a single file of up to 10MB per upload button, and it supports a wide range of file types. Per Webflow's Help Center, that includes documents like PDF, DOC, DOCX, XLS, and CSV, images like JPG, PNG, SVG, and WEBP, plus audio, video, and ZIP files.

The 10MB limit per file is the one to remember. If people need to send something larger, one button will not cut it. A common fix is to ask them to compress the file or to add more than one upload button, since each button handles its own single file.

Because the list of supported types is broad, most business needs are covered out of the box. Resumes, contracts, design files, and spreadsheets all fit. If you expect very large video or design files, plan for that limit up front instead of discovering it after a visitor complains.

How do I limit which files people can send?

You can restrict the field to specific file types in the field settings. Webflow lets you choose to allow only certain formats for that upload button, so a resume field can accept PDFs and Word documents but reject random image or video files.

I almost always set this. If I am collecting resumes, I limit it to PDF and DOCX. This keeps the submissions clean and cuts down on people sending the wrong thing. It also gently signals what you actually want, which reduces confusion.

Restricting types is a small setting with a big payoff. It makes your inbox predictable and saves you from opening files you cannot use. Set it based on what you truly need, not on every format Webflow could accept.

Where do the uploaded files go after someone submits?

Uploaded files are stored by Webflow and attached to each form submission, which you can view in your site's Forms settings. From there you can download the file. Webflow also counts these files against your form storage, so it is not unlimited.

Webflow's Help Center states that form file storage is free up to 10GB, then costs $0.50 per GB each month after that, with a hard limit at 100GB. Once you hit that cap, new submissions stop being collected. That last part is important, because it means a full storage bin can quietly cost you leads.

So treat storage as something to manage, not ignore. Download and clear old files you no longer need, especially on a busy form. Watching your storage is part of keeping the whole system healthy over time.

How do I send uploaded files to HubSpot, Airtable, or my inbox?

You connect your form to another tool so each submission, and its file, flows where your team works. Webflow can email you on submission, and automation tools like Zapier or Make can push the data and file link into HubSpot, Airtable, or cloud storage like Google Drive.

The pattern is the same one I use for other forms. The submission triggers an automation, which then creates a record or a task with the file link attached. I cover a full version of this in my guide on connecting a Webflow contact form to HubSpot with Zapier, and the file field rides along the same path.

If you prefer to keep things off Zapier, there are direct routes too. I wrote about sending Webflow form submissions to Airtable without Zapier, and that approach carries the uploaded file link as well. Pick the route that matches your stack and budget.

How do I keep file uploads safe and spam-free?

You protect the form with spam controls and sensible limits, and you handle the files people send with care. Turn on Webflow's built-in reCAPTCHA to cut bot submissions, and restrict file types so people cannot dump anything they like into your storage.

Think about privacy too. If people upload documents with personal details, you are now holding that data. Only collect what you truly need, download and store it somewhere secure, and clear it from Webflow when you are done. Treat a stranger's file the way you would want yours treated.

A required field, a type restriction, and reCAPTCHA together stop most of the mess. They keep your submissions clean, your storage under control, and your inbox free of junk. These small settings are what separate a form that helps from a form that becomes a headache.

What should you do next?

Confirm your site is on a plan that supports uploads, add the field to one form, and run a real test on the published site. Restrict the file types, set the field as required if you need the file, and connect the submission to wherever your team actually works.

Start with a single form rather than adding uploads everywhere at once. Get one working cleanly, watch how people use it, and expand from there. That is the calm way to add a feature without creating new problems.

If you want help wiring up file uploads so the files land neatly in your CRM or storage, this is the kind of Webflow and automation work I do. I am happy to walk through your setup and get it running. Let's chat.