File upload

A control for adding files to a system: a choose-file button, or an area you drop files onto (a dropzone).

Also called: file upload, upload, uploader, upload a file, attach a file, attach, attachment, dropzone, drop zone, drop files here, drag files here, paperclip

What it is for

It lets you attach documents, images and other files. It should say which formats and sizes are allowed, show upload progress, and preview the uploaded files with a way to remove them.

Where you see it

  • Job sites — attaching a résumé
  • Chats — sending photos and files
  • Profile settings — updating your avatar

What it is called in code

  • <input type="file">
  • dropzone
  • FormData

See also

  • Drag and drop — An interaction where you grab an item with the cursor or a finger and move it to a new place. The spot to grab is often marked with its own icon (a drag handle).
  • Loading indicators — Anything that shows the site is busy: a progress bar, a spinning icon, or gray placeholders where content will appear.
  • Text input — A field where a person types something in: letters, numbers, symbols.