<?xml version="1.0" encoding="utf-8"?>

OTP input

OTP input

OTP (One-Time Password) inputs are used when users need to verify their identity or confirm an action through a short code, often sent via SMS or email. They’re common in login, payment, and account recovery flows.

OTP inputs are usually split into several small boxes, each meant for a single digit. This design makes it easier for users to track their progress and correct mistakes. Some versions auto-advance the cursor after each digit, which reduces friction.

If you expect users to paste the full code from a message, make sure your input supports auto-filling and pasting. On mobile, OTP auto-fill detection (available on both Android and iOS) helps speed up the process and prevents typing errors.

Pro Tip: Always make sure the input clearly indicates when the code is incorrect or expired, and provide an easy way to request a new OTP without restarting the process.

Improve your UX & Product skills with interactive courses that actually work