Verify Account UI
A 6-digit code input where focus jumps between boxes as you type.
StarterWeb appUI component2–4hAI-buildable 5/5no setup
Separate inputs per digit with focus that advances on entry and retreats on backspace. Paste handling — dropping a full code in and distributing it across the boxes — is where most implementations fall over.
UI
Logic
Useful
Hosting · Free forever
Deploys free on GitHub Pages, Cloudflare Pages or Vercel Hobby.
Deploy it and share a link.
Core features · 5
- Six single-character inputs for the code
- Focus advances automatically as each digit is entered
- Backspace on an empty box moves focus backwards
- Pasting a full code distributes it across all boxes
- Only numeric input is accepted
The interesting part
- Paste distribution and backspace focus traversal
Once it works
- Auto-submit when complete
- Add an error shake for invalid codes
Suggested stack
reacttypescripttailwinddnd-kitreact-hook-formsupabase