HQ-CropperImage Cropper for High-Quality Square Crops

Lightweight, zero-dependency, mobile-friendly

Get Started

Live Demo

GitHub

📦

Zero Dependencies

Pure TypeScript with no external dependencies. Lightweight bundle size of ~24KB.

📱

Mobile-Friendly

Full touch support with responsive layout. Works great on phones and tablets.

🎨

Fully Customizable

Override any CSS class. Inherits fonts from your app. Supports custom themes.

⚡

Framework Agnostic

Works with React, Vue, Angular, Svelte, or vanilla JavaScript.

🖼️

High Quality Output

Configurable output size and compression. Supports JPEG and PNG formats.

✅

Built-in Validation

File type and size validation with customizable error handling.

Quick Start

bash

npm install hq-cropper

typescript

import { HqCropper } from 'hq-cropper'

const cropper = HqCropper((base64, blob, state) => {
    console.log('Cropped image:', base64)
})

// Open file picker
document.querySelector('#button').addEventListener('click', () => {
    cropper.open()
})