Integrate With Your Project in a Couple Minutes

Easy to use with every web-based stack

The fastest and easiest way to add image editing capabilities to your SaaS, website, or web-based app.

Install with NPM

First install the Pintura test version with NPM (or Yarn, or PNPM).

The test version is nearly identical to the full version of Pintura. It doesn't support video editing and adds a watermark on top of the image.

npm install @pqina/pintura

Then import Pintura like shown below.

import '@pqina/pintura/pintura.css';
import { openDefaultEditor } from '@pqina/pintura';

    src: 'image.jpeg'

Next steps

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.

Framework specific components make Pintura work everywhere

No dependencies

Easy to use components for popular JavaScript frameworks.

First install the React components.

npm install @pqina/react-pintura

Then use Pintura like any other React component.

import { PinturaEditor } from '@pqina/react-pintura';
import { getEditorDefaults } from '@pqina/pintura';

import '@pqina/pintura/pintura.css';

function App() {
    const [inlineResult, setInlineResult] = useState();

    return (
        <div style="height: 80vh">
                onProcess={(res) =>

            {inlineResult && <img src={inlineResult} alt="" />}

export default App;

Next steps

Example projects to help you get started even faster

Get off to a flying start

Dozens of carefully prepared examples make it easier to see how set up Pintura with your project.




  • React Native

    A React Native example project showing how to install Pintura on React Native.

  • Cordova

    A JavaScript project showing how to use Pintura with Cordova.

  • Ionic

    An Angular project showing how to install and configure Pintura with Ionic.

File Managers

Ready to purchase your license?

Purchase below. 60 day money-back guarantee, we refund you in full.