filepond: A JavaScript repository from Pandahisham

A (21 KB gzipped) JavaScript library that can upload anything you throw at it, optimizes images for faster uploads, and offers a great, accessible, silky smooth user experience.

Core Features

Accepts directories, files, blobs, local URLs, remote URLs and Data URIs.
Drop files, browse on filesystem, copy and paste files, or add files using the API.
Async uploading with AJAX or encode files as base64 data and send along form post.
Accessible, tested with AT software like VoiceOver and JAWS, navigable by Keyboard.
Image optimization, automatic image resizing, cropping, and correcting of EXIF orientation on the client saves bandwidth.
Responsive, automatically scales to available space, is function on both mobile and desktop.

Learn more about FilePond

Plugins

Frameworks & Libraries

Boilerplates

Quick Start

Install using npm:

npm install filepond

Then import in your project:

import * as FilePond from 'filepond';

// Create a multi file upload component
const pond = FilePond.create({
    multiple:true,
    name:'filepond'
});

// Add it to the DOM
document.body.appendChild(pond.element);

Or get it from a CDN:

<!DOCTYPE html>
<html>
<head>
  <title>FilePond from CDN</title>
  
  <!-- Filepond stylesheet -->
  <link href="https://unpkg.com/filepond/dist/filepond.css" rel="stylesheet">
  
</head>
<body>
  
  <!-- We'll transform this input into a pond -->
  <input type="file" class="filepond">
  
  <!-- Load FilePond library -->
  <script src="https://unpkg.com/filepond/dist/filepond.js"></script>

  <!-- Turn all file input elements into ponds -->
  <script>
  FilePond.parse(document.body);
  </script>
  
</body>
</html>

Getting started with FilePond

License

Commercial license

If you want to use FilePond on commercial sites, themes, projects, and applications, the Commercial license is what you need. With the commercial license, your source code is kept proprietary. View the license options on the pricing page.

Open source license

If you're working on an open source project under a license compatible with GPLv3, you may use FilePond under the terms of the GPLv3.

For more information you can read the full license here.

Pandahisham/filepond