File Upload 🟢

Goals

• Work with a standard webflow form

• Support file posting to;

  • Webflow ( with business plan )

  • Basin

  • UploadCare ( future )

• Support click or drag-drop to add files

• Allow single or multiple files

• Support constraints

  • File type

  • File count

  • File size

Max file upload size https://discourse.webflow.com/t/change-form-file-upload-maximal-file-size/94846/11

Single-file v. Multi-file?

File type constraints?

Usage

Drop into a Webflow form.

You must have enctype="multipart/form-data" on the <form>. Without it, the browser submits as application/x-www-form-urlencoded and drops file contents.

Technical Notes

Implemented as a Code Component.

Styling

  --cc-formfile-border-color: #059669;
  --cc-formfile-border-thickness: 2px;
  --cc-formfile-background-color: #f8fafc;
  --cc-formfile-hover-background-color: #ecfdf5;