Overview
Image Cropper for Payload CMS
A Payload CMS 3.x plugin that adds interactive image cropping to your collections.
A Payload CMS 3.x plugin that adds interactive image cropping to your collections. Define crop presets per field, let editors crop in a modal, and automatically generate optimized variants with Sharp — stored locally or on S3.
What you get
- Interactive crop modal with aspect ratio constraints (react-image-crop)
- Multiple crop presets per field — desktop, mobile, social, etc.
- Multi-size crops — one crop selection generates several output sizes for responsive images
- Server-side image generation — WebP, JPEG, or PNG via Sharp
- S3 / cloud storage — built-in upload and automatic cleanup
- Frontend helpers — getCropUrl and resolveMediaCrop
- TypeScript-first — full types exported
When to use it
Use this plugin when editors need to control how images are cropped for different layouts (hero, card, thumbnail) without manually exporting files in Photoshop or cropping separately per breakpoint.