Components

Upload

Upload drop zones allow users to upload and submit files.

Upload
  • Usage
  • Examples
  • Related Component
  • Download

Usage

The upload component can be used in two different ways: to upload one single file and to upload multiple files.

Single-file upload

An uploading or uploaded file blocks the upload field until it is cancelled or removed.

Single-file when empty and when highlighted while dragging an uploadable file onto it.

Single-file upload when a file upload is in progress and when a file has already been uploaded.

Multi-file upload

Files are listed below each other and expand the upload component. The upload drop zone remains receptive so that additional files can be added.

Empty multi-file upload.

Multi-file upload containing an already uploaded and a currently uploading file.

Compact upload

An alternative to the standard upload component is a more compact version without an icon. This version is helpful when less space is available (e.g. on mobile sites).

Empty compact upload without an icon.

Empty compact upload is highlighted when dragging an uploadable file onto it.

Examples

Related Component

Download

If you download any document, you accept ourĀ Terms and Conditions.

Sketch UI Library
ZIP
85.97 MB