Pintura Image Editor, A Powerful JavaScript Image Editor SDK - PQINA

A powerful JavaScript Image Editor that integrates with every stack

A fully configurable image editor SDK that's intuitive on mobile and desktop. Set image requirements and help your customers upload better pictures.

Crop, rotate, resize, filter, annotate, adjust colors, and much more…

Get started Try editor Try it here!

Default Drag selection Crop outside image Profile picture Customize Code Image

This is a small subset of the available configuration options.

To learn more read the documentation, or ask any questions here.

Trusted and used by 2,796 companies worldwide

Pintura Image Editor is pretty sick! If you need any sort of image editor in your application, use Pintura for a 10,000 hour head start.

A fantastic user and developer experience

Everything you need in one package

Pintura Image Editor packs everything your users need to edit images, runs in the browser, and can easily be integrated in any project.

• Enforce crop aspect ratio

  Enforce a single crop aspect ratio or offer a range of aspect ratio options to make sure uploaded images are always perfect.

• Fast image uploads

  Boost file upload speed and lower server bandwidth usage by compressing, resizing, and converting images in the browser.

• Rotate, resize, and flip

  Make the pixel perfect crop each time. Scale images using the zoom control, mouse wheel, touchpad, or intuitive multi-touch interaction.

• Overlay crop guides

  Help your customers upload better images. Show an overlay on top of the editor to illustrate bleed margins or profile picture boundaries.

• Photo filter effects

  Apply a set of carefully crafted filter effects to your photos. Extend with your own filters and the Pintura Image Editor UI will update automatically.

• Responsive and accessible

  Scales to best fit the available space. Interact with touch, mouse, and keyboard. Works great on mobile, tablet, and desktop.

Show more features (42)

• Control language and icons in the user interface
• Undo, redo, and reset actions
• Toggle individual editor controls
• Output binary image and/or editor state
• Add annotations to images
• Store editor state to resume editing at a later time
• Rotate, z-order, flip, and duplicate shapes
• Enter multiline text and align to left, center, or right
• Create text boxes, text lines, and auto height text shapes
• Automatically apply watermarks
• Apply styles with CSS Custom Properties
• Use custom fonts, set custom shape colors, and dropdown options
• Set predefined shapes and control shape editing rules
• Switch between bright and dark theme with two CSS Custom Properties
• Control image brightness, contrast, exposure, saturation, clarity, and gamma.
• Apply a dark or bright vignette
• Render different frame styles around images
• Set a target output image size
• Manualy resizing of images
• Automatically render in a modal
• Render as overlay on top of an existing image
• Render as inline editor right in the webpage
• Load file objects, blobs, URLs, and dataURLs
• Load canvas elements and image tags
• Multi-touch interaction on mobile
• Supports keyboard navigation
• Load raster images like GIFs, PNGs, WEBPs, JPEGs and BMPs
• Automatically corrects photo orientation
• Copy JPEG EXIF data to output image
• Transform input images to other image formats
• Supports custom load logic to load HEIC or other image formats
• Compress JPEG and WEBP images
• Set different arrow start and end styles
• Preserve transparency when editing and saving PNGs
• Easily integrate with third party file upload libraries
• Enable or disable aspect ratio dropdown
• Customize crop aspect ratio dropdown options
• Add stickers to editor with drag drop
• Makes optimal use of different viewport sizes
• Supports tree shaking for minimal bundle sizes
• Great selection of default image filters
• Tested successfully on fast and slow devices

Get started Take tour

Use standalone or with your favourite framework

Ready for your project

Whether you're using jQuery, React, Vue, Svelte, Angular, or something completely different, Pintura Image Editor will fit right in.

• Written in vanilla JavaScript. No dependencies.
• Compatible with a wide range of browsers and devices.
• Includes TypeScript declaration file.

I spent weeks writing my own editor and it still sucked and was buggy. Was blown away at how easy it was to integrate Pintura Image Editor into our existing app! Within 2 hours I was done.

• JavaScript
• Custom Elements
• jQuery
• React
• Vue
• Angular
• Svelte
• Alpine

• index.html

• index.html

• index.html

• App.jsx

• App.vue

• app.component.html
• app.component.ts
• app.module.ts

• App.svelte

• index.html
• alpine-pintura.js

Use with popular file upload libraries

Copy paste one of the Dropzone, FilePond, Uppy, or jQuery File Upload integrations and you're up and running.

Compatible with modern web technologies

Works with TypeScript, tested with Electron powered apps, looks great with any CSS framework.

• JavaScript
• Custom Elements
• jQuery
• React
• Vue
• Angular
• Svelte
• Alpine
• TypeScript
• Electron
• React Native
• Cordova
• Ionic
• Capacitor
• Next.js
• Nuxt.js
• Tailwind CSS
• Bootstrap
• Foundation

• Easy to integrate and the editor is fluid, without any lag. Really an amazing tool to work with.

• Super easy to implement code with the instructions they provide. The photo uploading and editing is state of the art!

• Simple to use and very customizable. Implementation was much faster and easier than the tool we used previously.

• Very nice & clean Photo/video-script! So far the best I could find.

• An amazing library which our team has absolutely loved. It's clear the time, thought, and care you've placed into developing such a wonderful piece of software.

Save countless development hours

Easily integrate Pintura Image Editor in your project. Get stuck? No worries. Just contact support, we're always happy to help out.

Get started

Help your customers upload better pictures

No more fixing photos on the backend

Set requirements and increase the quality of your user-generated content. Control how images arrive on your server.

We love working with Pintura - it has given us a shortcut to offering image cropping and stickers that would have been very difficult to implement ourselves.

Overlay crop guides

Visually indicate how to make the perfect crop. Whether it's rendering a circular or rounded rectangle overlay to indicate profile picture bounds, or indicating print bleed margins, the shape API has got you covered.

Demo

Lock crop aspect ratio

Be sure customer images always conform to your requirements and fit perfectly by defining a fixed aspect ratio or by supplying a list of preset aspect ratios.

Demo

Automatically watermark images

Save time and automatically add watermarks or shapes to images. Using the Pintura Image Editor shape shape API you can programmatically draw anything on top of the output image.

Resize images to fit a target size

Set a maximum target size, define the resize mode (contain, cover, or force) and Pintura Image Editor will automatically scale images to fit the target size.

Autocorrect mobile photo orientation

Stop receiving flipped or rotated photos. Pintura Image Editor makes sure the uploaded image is always presented correctly to the customer and the resulting image orientation is correct.

Censor information in images

Make it easier for customers to censor sensitive information in their images. Pintura applies a secure image blurring algorithm to make sure data is sufficiently scrambled and cannot be recovered.

Powerful annotation tools

Draw rectangles, circles, lines, arrows, and text. Rotate, resize, duplicate and z-order annotations. Freedraw with a sharpie. Control which tools are available, which colors and custom fonts can be choosen from, and much more.

Demo

Edit video in the browser

The Video Editor extension adds video cropping, color effects, color adjustment, trimming, and clipping to Pintura. Generate output video's on the client leveraging native browser APIs.

Demo

Finetune the UI to your needs

Enable or disable interface elements and features, change the language of the control labels and/or update the icons.

Integrate with AI Services

Pintura can be easily integrated with third-party AI services to add features like background removal and generative AI.

Use the fully functional example project on the Retouch plugin documentation page to get started.

Live image preview

Render on top of an image to show a live preview of the result. Ideal for editing a profile page header or landing page hero images.

Give live preview mode a try below!

Edit image

Loading editor...

Ready to get started?

If you find Pintura Image Editor is not a great fit for you project, contact us within 60 days and we'll refund you in full, no questions asked.

Get started Take tour

About PQINA

PQINA is run by Rik Schennink and helps 11,890 companies worldwide to be successful.

Over 500 customers rate PQINA an average of 4.9 out of 5

Pintura demonstrates that the web can rival the native app experience, it just needs an extra bit of attention.

Icons by Feather, Photography by Unsplash