Input OTP
A one-time password input component with smooth animations and accessible design.
Basic Usage
Current value: (empty)
Radius Variations
Override slot styles to match different products and density needs.
Subtle Rounding
Compact
Password Masked
Secure PIN (Always Masked)
Digits are hidden for privacy
Toggle Visibility
4-Digit PIN
Enter your PIN
Enter your 4-digit security PIN
With Separator
Common pattern for verification codes split into groups.
Different Lengths
4 Digits
5 Digits
8 Digits (with separators)
Disabled State
Disabled inputs cannot be focused or edited.
Verification Flow
Verify your email
We sent a 6-digit code to sarah@example.com
Error State
Invalid Code
The code you entered is incorrect
1
2
3
4
5
6
Please check your code and try again
With Pattern Restriction
Numbers Only (default)
Alphanumeric
Accepts both letters and numbers