File input

File upload × Actual CSS

The native file input with .file, then two uploaders: Dropzone rendering its file rows as Actual components, and FilePond v5 themed through its CSS custom properties. Switch themes and watch both follow.

Dropzone docs FilePond docs

Native — the baseline

.file themes the picker button and keeps everything else native: the form submits the files, no JavaScript involved.

Dropzone — an uploader composed from Actual

Dropzone owns drop, queue and requests; its previewTemplate is plain markup, so each file is an Actual .list-item with an .avatar, a .progress and a .close. Without the script, the zone keeps a native .file input. The upload is simulated: the page has no server.

Documents

Drop files here

    Images or PDFs, up to 5 MB each.

    FilePond — an uploader on Actual tokens

    <file-pond> wraps the same .file input: before the script loads, or without it, the native control stays. The skin is the --default-* token map above; FilePond follows the theme's color-scheme for everything else.

    Drop images or PDFs, or browse.

    Which one?

    • A form that posts a few files: native .file.
    • Drag and drop, previews and progress in your own markup: Dropzone with an Actual previewTemplate.
    • A complete uploader UI (media previews, image editing, camera, chunked uploads): FilePond on the token bridge.