# File uploads

> Accept resumes, images and documents. Files upload straight to secure storage with drag and drop and progress bars.

Source: https://docs.formclick.io/html-forms/file-uploads

> **Pro and Business plans:** File uploads are available on the Pro and Business plans and need `formclick.min.js`.

Add a normal `<input type="file">` and include the script. Formclick turns each file input into a drag-and-drop zone with a file list, progress bars and remove buttons.

_Animation: a file input becomes a drag-and-drop zone; each file shows its own progress bar and a check mark when uploaded. Each file input becomes a drop zone. Files upload in parallel, with a progress bar each._

```html title="apply.html"
<form action="https://api.formclick.io/submit" method="POST">
  <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">
  <input type="text"  name="name"  required>
  <input type="email" name="email" required>

  <!-- One file, PDF or Word only -->
  <input type="file" name="resume" accept=".pdf,.doc,.docx">

  <!-- Several files, images or PDF -->
  <input type="file" name="work_samples" accept="image/*,.pdf" multiple>

  <button type="submit">Submit application</button>
</form>

<!-- Handles submit, file upload, loading state and success/error messages. -->
<script src="https://cdn.formclick.io/formclick.min.js"></script>
```

## Attributes

| Attribute | Effect |
| --- | --- |
| `name` | The field name the file (or list of files) is saved under. |
| `multiple` | Allow several files in one field. |
| `accept` | Limit file types, e.g. `.pdf,.docx` or `image/*`. Checked in the browser before uploading. |

## Limits

- **5 MB per file.** Larger files are rejected in the browser with a clear message, and the server enforces the same limit.
- Duplicate files (same name and size) are only added once.
- Uploads retry automatically up to 3 times with back-off if the connection drops.

## How it works

1. When the visitor submits, the script asks Formclick for a one-time upload URL for each file.
2. Each file uploads **directly** to secure storage in parallel, so large files never pass through the form endpoint.
3. The submission is sent with a link and details for every file.

In the saved submission a single file looks like this (a `multiple` field holds a list of these):

```json
{
  "name": "Jane Smith",
  "resume": {
    "name": "jane-smith-cv.pdf",
    "size": 248133,
    "type": "application/pdf",
    "url": "https://…"
  }
}
```

> **Warning:** A plain HTML form without the script cannot send files. The browser would post the file name only, so always include `formclick.min.js` on forms with file inputs.

Next: [Advanced file uploader](https://docs.formclick.io/html-forms/advanced-file-uploader) for size limits and styling, and [File attachments](https://docs.formclick.io/html-forms/file-attachments) for how files reach you.
