Upload
Upload drop zones allow users to upload and submit files.This guide explains how to use them.
-
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. Users can cancel the upload process or remove the file already uploaded.
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
