Shadcn.io is not affiliated with official shadcn/ui
Image Crop
Image cropping interface with aspect ratio locking and auto size optimization for React
Drag to position, resize handles to adjust—built on react-image-crop. Lock aspect ratio for avatars or thumbnails. onCrop callback gives you a PNG data URL. If the result exceeds maxImageSize, it recursively scales down until it fits. Compound API: ImageCropContent for the crop area, ImageCropApply to confirm, ImageCropReset to start over. Themed with shadcn CSS variables. Perfect for profile photo editors or image uploads.
Scroll to load preview
Installation
Related Components
FAQ
Was this page helpful?
Sign in to leave feedback.