FilePond Pintura Image Editor

Combine FilePond with Pintura and create the perfect image edit and upload experience.

Learn more about Pintura

Show image preview

We can use the Image Preview plugin to show a preview of each dropped image.

import { create, registerPlugin } from 'filepond';
import 'filepond/dist/filepond.css';

// Import the Image Preview plugin
import FilePondPluginImagePreview from 'filepond-plugin-image-preview';

// Register the plugin with FilePond
registerPlugin(FilePondPluginImagePreview);

// Get a file input reference
const input = document.querySelector('input[type="file"]');

// Create a FilePond instance
create(input);