cropo

Project Page

code Example on codepen

Table of Contents

• About
• Getting Started
• Usage
• Features

About

Cropo is a fast, lightweight image cropping tools for JavaScript. Resize and crop your uploaded image using a intuitive user interface.

Getting Started

Install via NPM

npm install --save cropo

Install via Yarn

yarn add --save cropo

Usage

1 - Include the cropo using ES modules

using ES modules

import { Cropo } from 'cropo';

using CommonJs

const { Cropo } = require('cropo');

2 - initialize Cropo with the following code

const cropo = new Cropo({
    imageUrl: image,
    canvas: document.getElementById('canvas'),
    rangeInput: document.getElementById('inputRange')
})

3 - Optionals

// download canvas image
cropo.download();
// get image as data url
cropo.getDataUrl();

Features

• Lightweight
• No dependencies
• Touch enabled
• Pinch gesture
• Supports any images format
• Supports url and data url