File Upload Dropzone 4 component design & features
This file upload example uses the diceui FileUpload component with FileUploadDropzone restricted to image files using the accept prop. It demonstrates custom styling with primary color accents, hover states, and drag state indicators. Toast notifications display when non-image files are rejected.
Image-specific dropzones are common in media galleries, profile picture uploads, or content management systems where only images are needed. The visual styling helps users understand the file type requirement before attempting to upload.