Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Dialog Block Add Writer Profile
Add writer profile dialog with avatar upload, image preview with remove option, author name and title inputs in split layout
Looking to implement shadcn/ui blocks?
Join our Discord community for help from other developers.
Create author profiles visually. This React profile dialog provides avatar image upload with preview, author name input, and title field in a clean split-pane layout. Built with shadcn/ui Dialog, Avatar, Input, Label, Button components and Lucide React icons, content managers can add writer profiles with drag-and-drop or click-to-upload image handling. File size validation, remove image option, and responsive grid layout—perfect for CMS platforms, blog admin panels, or any content app where author profiles need visual identity alongside biographical information.
Installation
Related blocks you will also like
React Dialog Block Invite Members
Team member invitation dialog
React Dialog Block Edit Profile Form
Form dialog with input fields
React Dialog Block Create Workspace
Form dialog with switch toggle
React Dialog Block Schedule Meeting
Meeting scheduler form dialog
React Dialog Block Project Initializer
Multi-step configuration dialog
React Dialog Block Contact Card
Contact profile with quick actions
Questions you might have
React Dialog Block Project Initializer
Project initialization dialog with numbered steps, framework selection, package manager, linter configuration, and testing tool options
React Dialog Block Feedback Rating
Feedback rating dialog with emoji scale selector, optional comment textarea, and submit button