Crop Frame

Minimal crop overlay on a small square image with corner marks and an output-size chip.

Crop Frame1200 × 630

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use
import { Upload25 } from "@/components/beste/piece/upload25";

<Upload25
  imageSrc="https://images.unsplash.com/photo-1612350109947-4ef9a3cbf6f2?w=250&auto=format&fit=crop&q=60&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxmZWF0dXJlZC1waG90b3MtZmVlZHwzOHx8fGVufDB8fHx8fA%3D%3D"
  output="1200 × 630"
/>

More Upload pieces

View all Upload
Image Preview
brand-hero.jpg2400 × 1600 · 1.4 MB

Uploaded-image card with a dashed crop overlay on a gradient placeholder and rotate, crop, delete tools below.

Image Row
brand-hero.jpg2400 × 1600 · 1.4 MB

Image Row

upload23

Compact image file row with a square warm gradient preview and a filename plus dimensions line.

+20
Recent uploads24 items

Upload Stack

upload20

Compact upload summary with four overlapping thumbnails, a +N overflow tile, and a total item count.

Add a cover imageRecommended 1600 × 600, up to 4 MB

Gradient banner placeholder that prompts a cover image with size hint and inset dashed border.

Uploading 24 files9.2 MB/s overall
74%
18Done
3Uploading
3Queued

Aggregate upload card with a total-files header, a single sky bar, and a done, uploading, queued tally.

Paste an image from your clipboardScreenshot, copy, and press the shortcut to drop it here.
+V

Dashed panel encouraging a paste gesture, with a tinted clipboard tile and ⌘V hint chip.