Camera Capture

Dark viewfinder mock-up with corner brackets, a live dot, and a large circular capture button.

Scan the receiptPoint the camera at the total line

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

Import & use

import { Upload10 } from "@/components/beste/piece/upload10";

<Upload10
  title="Scan the receipt"
  hint="Point the camera at the total line"
  action="Capture"
/>

More Upload pieces

View all Upload

Scanning page · 3 / 5

Document Scanner

upload26

Dark scanner viewfinder with a live chip, page counter, corner guides, shutter, and a captured-pages thumbnail strip.

Change profile photo

Avatar Uploader

upload5

Circular avatar with a dark camera button on the corner that invites a new profile photo.

0:42

launch-teaser.mp454 MB

Video Preview

upload24

Uploaded-video card with a play button over a dark thumb, duration badge, and a filename footer.

brand-hero.jpg2400 × 1600 · 1.4 MB

Image Preview

upload18

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

Attach supporting documents

Compact Attach

upload3

Single-line upload affordance with a paperclip icon, prompt copy, and a trailing browse button.

Uploading 24 files9.2 MB/s overall

74%

18Done

3Uploading

3Queued

Batch Summary

upload19

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