Open Source JavaScript Library for Image Processing

Open Source API for Cropping Images Smartly

What is SmartCrop.js?

SmartCrop.js is a free and open-source API that allows JavaScript developers to crop images automatically. The API is content aware and uses a set of algorithms to crop images. The API finds edges using the Laplace, finds faces by finding regions with color like skin, finds regions with high saturation, and processes the image. After finding a specific region, the API boosts that region and generates a set of candidate crops.

While cropping the image, you can use HTMLImageElement, HTMLCanvasElement or HTMLVideoElement and set image cropping options including minScale, width, height, boost, and ruleOfThirds.

At A Glance

An overview of SmartCrop.js features.

Crop
Smart Crop
MinScale
Set Width
Set Height
Boost
RuleOfThirds

SmartCrop.js

SmartCrop.js supports the popular Image file formats listed below.

Reader

Writer

SmartCrop.js

Platform Independence

SmartCrop.js can be used in multiple environments like Node or browsers etc.

JavaScript

SmartCrop.js

Getting Started with SmartCrop.js

The recommended way to install SmartCrop.js via NPM. Please use the following command to install it.

Install SmartCrop.js via NPM

 npm install smartcrop

Smart Crop Images via Free JavaScript API

The open source SmartCrop.js library allows JavaScript developers to smart crop images programmatically. Based on the API algorithm, the API finds high saturation areas, finds color with skin tones, finds edges, and provides a smart guess to crop the image. In order to smart crop the image, the API provides smartcrop.crop(image, options) method. The method gets image and image options for the crop. By using the following one line of code, you can easily get a smart crop for your image

Smart Crop Image in JavaScript

Import Library
Crop Image

Crop Image in JavaScript

smartcrop.crop(image, { width: 100, height: 100 }).then(function(result) {
console.log(result);
});