👋 This is a community-driven shadcn/ui resource. For the official documentation, visit ui.shadcn.com
Account Email Preferences
Email address management with multiple email support, primary email selection, verification status badges, and add/remove email functionality
Looking to implement shadcn/ui blocks?
Join our Discord community for help from other developers.
Managing multiple emails shouldn't be complicated. This React email preferences panel lets users add, verify, and set primary email addresses with clear status indicators. Built with shadcn/ui Card, Badge, Button, and Input components with Lucide React icons, each email shows verification status, primary designation, and when it was added. One-click verification resend, confirmation dialogs for removal, and email validation—perfect for user dashboards, account settings, or any app where users need multiple emails for notifications, recovery, or team collaboration.
Installation
npx shadcn@latest add https://www.shadcn.io/registry/account-email-preferences-01.jsonnpx shadcn@latest add https://www.shadcn.io/registry/account-email-preferences-01.jsonpnpm dlx shadcn@latest add https://www.shadcn.io/registry/account-email-preferences-01.jsonbunx shadcn@latest add https://www.shadcn.io/registry/account-email-preferences-01.jsonRelated blocks you will also like
Account Basic Information
Personal details and profile info
Account Security Settings
Password and 2FA management
Account Notification Preferences
Email and push notification settings
Account Privacy Settings
Privacy and data control
Account Connected Accounts
Link social media accounts
Account Activity Log
View account activity history
Questions you might have
Account Danger Zone
Account danger zone with destructive actions like deactivate account and delete account with confirmation dialogs and warnings
Account Third-Party Integrations
Third-party service integrations with OAuth connections, verification codes, toggle controls, and connected account management