👋 This is a community-driven shadcn/ui resource. For the official documentation, visit ui.shadcn.com
Edit User Profile
CRUD form for editing user profile information with avatar upload, name, email, bio, role selection, and status toggle
Looking to implement shadcn/ui blocks?
Join our Discord community for help from other developers.
User profile management shouldn't feel like filling out tax forms. This React CRUD form combines avatar upload with drag-and-drop, text inputs for personal information, role selection, and status toggles. Built with shadcn/ui Card, Input, Select, Textarea, Switch components, the form includes file preview, validation-ready fields, and clear save/delete actions. Responsive layout, accessible controls, and mobile-optimized design—perfect for admin dashboards, team management systems, or user account settings where quick profile updates improve productivity.
Installation
npx shadcn@latest add https://www.shadcn.io/registry/crud-edit-user-01.jsonnpx shadcn@latest add https://www.shadcn.io/registry/crud-edit-user-01.jsonpnpm dlx shadcn@latest add https://www.shadcn.io/registry/crud-edit-user-01.jsonbunx shadcn@latest add https://www.shadcn.io/registry/crud-edit-user-01.jsonRelated blocks you will also like
Edit Product Form
CRUD form for product inventory management
Account Settings Form
Comprehensive user settings with avatar upload
Create Blog Post
Form for creating new content
User List Management
User list with search and actions
Product Detail View
Comprehensive detail view with tabs
Delete Confirmation
Confirmation dialog for deletions