Vibe UI
Initializing Vibe UI System...
Vibe UI

Uploader

A premium stateful dropzone component supporting drag-and-drop file inputs, file size and type validations, dynamic uploads list with progress indicator gauges, and 4 design preset themes.

Uploader

A premium stateful dropzone component supporting drag-and-drop file inputs, file size and type validations, dynamic uploads list with progress indicator gauges, and 4 design preset themes.

Preview

Drag & drop files here, or browse

Supports image, PDF or files up to 5MB

Installation

pnpm dlx vibe-ui-kit@latest add uploader button progress badge
💡 Vibe UI Component Dependencies: This component requires other components to work correctlyPlease make sure you also install these Vibe UI component dependencies: button, progress, badge

All Variations

Explore all interactive states and combinations of the Uploader component.

1. Preset Variations

Every variation supports our 4 built-in theme presets.

Glassmorphism Preset

Drag & drop files here, or browse

Supports image, PDF or files up to 5MB

Retro Neobrutalism Preset

Drag & drop files here, or browse

Supports image, PDF or files up to 5MB

Neon Glow Preset

Drag & drop files here, or browse

Supports image, PDF or files up to 5MB

Component Concept

Vibe UI's Uploader is a stateful dropzone interface built on top of native file inputs. It provides a visual area for drag-and-drop selections, file validators, size validation indicators, and reactive layout grids.

Accessibility

  • Keyboard Focusable: Fully clickable and focusable dropzone targets.
  • Screen Reader Support: Text labels explicitly describing size limitations.

Contributors

JS
Jenish Sabhadiya

Theme Customizer

8px
@theme {
  --radius: 0.5rem;
  --glass-blur: 8px;
}
Changes apply instantly to this documentation workspace.
Uploader | Vibe UI