Website Banner Crop Preview
Preview responsive banner center-safe areas and mobile side-crop risk.
Controls
Local image preview
Your image stays in your browser. We do not upload or store your file.
Download overlays are transparent guides only. Uploaded image previews stay in this browser.
Workspace preview
Safe-zone result
Website Banner Crop Preview: working canvas 2400×900px, 3 overlay zones. Upload an optional local image to preview crop and UI risk.
| Check | Status | Detail |
|---|---|---|
| Minimum width | info | No minimum width listed for this spec. |
| Minimum height | info | No minimum height listed for this spec. |
| Recommended canvas | safe | 2400×900px vs 2400×900px target |
| Aspect ratio | safe | 0% ratio mismatch |
| Megapixels | info | 2.16MP; no MP limit listed. |
| File size | info | 0MB; no MB limit listed. |
| Format | info | No supported format list in this spec. |
- Responsive themes may crop wide banners on tall screens.
- Keep text and CTAs in the center safe area.
FAQ
Why do banners crop on mobile?
Wide images often fill a tall viewport by cropping left and right sides.
Where should text go?
Keep text and CTAs in the center safe area.
Related tools
Sources and limits
official: Shopify responsive banner crop guidance. Last checked 2026-05-24.
Platform dimensions are centralized in data files. Every platform spec must include sourceConfidence, sourceUrl and lastCheckedAt. Official platform documentation overrides this tool when specifications differ.