Image Cropper
A ShadcnUI-registry React component for uploading and cropping images with drag-and-drop and configurable aspect ratios.
About this project
Image Cropper is a reusable React image-crop component distributed through a custom ShadcnUI registry. Developers install the full source code into their project with a single CLI command (pnpm, npm, yarn, or bun all work) instead of adding another black-box dependency, which means the component is theirs to modify.
The component handles image selection via drag-and-drop or file browsing, then presents an interactive cropping interface built on react-easy-crop. It is configured through props: aspectRatio for 16:9, 1:1 and friends, fileLimitMB for upload constraints, and an onCropComplete callback that returns the cropped result.
Features
- Installable via a custom ShadcnUI registry, full source ownership
- Drag-and-drop or file-browse image selection
- Configurable aspect ratios
- File-size limits via a single prop
- onCropComplete callback for the cropped output
- Works with pnpm, npm, yarn, and bun