2FA
The setup and management surface for a second authentication factor on the account.
Onboarding & Auth · 7 checks · 14 resources
Before you ship
7- 01Method selection — authenticator app, SMS, or email code; offer at least two, as some users lack access to one
- 02Setup instructions — clear step-by-step guidance, particularly for authenticator flows that require scanning a QR code
- 03QR code or setup key — a scannable QR code or copyable key for linking an authenticator app to the account
- 04Verification step — a code entry step confirming setup was successful before 2FA is enabled on the account
- 05Recovery codes — a set of one-time backup codes for when the user loses access to their 2FA method
- 06Setup confirmation — a clear success state confirming that 2FA is now active
- 07Disable or reset option — a way to turn off or reconfigure 2FA from account security settings, gated by re-authentication
Resources that help you build this
14- Ark UI · 49 headless components with one API across React, Vue, Solid and Svelte
- Chakra UI · 114 accessible React components with a token-driven styling system
- UX Patterns for Devs · 92 UX patterns with accessibility rules, an MCP server and llms.txt
- Base UI · 37 unstyled React components from the Radix, Floating UI and MUI teams
- beUI · 106-item Motion + Tailwind registry for React, shadcn-compatible
- HextaUI · 103 shadcn registry items: primitives plus AI, auth, billing, settings and team blocks
- Opensource UI · 154 free MIT React and Next.js components across 26 categories, copy-pasted from pages that serve the full TypeScript source in the HTML
- Watermelon UI · MIT shadcn registry: 131 animated components, 187 page blocks, 30 base primitives
- Eldora UI · 40 animated React components plus 16 landing-page blocks, shadcn-installable
- Luxe · 17 copy-paste React components on Radix and Tailwind v4, with its own CLI
- moumenlab · shadcn registry of 13 motion-first interaction components, MIT, React 19 + Tailwind v4
- Rare UI · Fourteen free MIT animated React components, one file each, installed with the shadcn CLI
- Reverse UI · 68 animated React components built on Framer Motion, sold as a lifetime licence
- TailwindAdmin · shadcn/ui admin dashboard template in React, Next.js, Vue, Angular and TanStack