Two Factor 5 - Two factor with QR pairing

Pro

Two-column pairing screen with a scannable authenticator QR code on one side and a six-digit code form on the other.

Shadcn Two Factor 5 block

Component Data

  • ID:two-factor5
  • Access:pro
  • Created:Aug 20, 2026
  • Type:block

Two Factor 5 block design & features

TwoFactor5 is a pairing screen built with shadcn/ui. One column shows a scannable authenticator QR code and a scan instruction. The other column holds the heading, six-digit code input, and continue button.

The two columns share one bordered card on a muted viewport. The QR sits on a square plate with a quiet border. The form column is tighter and left-aligned on large screens.

This covers authenticator enrollment, not just the daily code prompt. Complexity is moderate: the QR encodes a TOTP pairing URI you can replace with a live secret.