Skip to content

Input OTP

An accessible one-time password input with individual character slots. Built on input-otp.

$cookest-ui add input-otp

6-Digit OTP

Standard 6-digit one-time password field for verification.

Verify your Cookest account

We sent a 6-digit code to chef@example.com

4-Digit PIN

Shorter OTP for PIN entry — for recipe lock screens.

Enter your 4-digit recipe collection PIN

PropTypeDefaultDescription
maxLengthnumberTotal number of characters the OTP input accepts.
valuestringControlled value of the OTP input.
onChange(value: string) => voidCallback when the value changes.
InputOTPSlot{ index: number }Each individual character slot. Must have an index.
InputOTPSeparatorA visual separator (dash) between slot groups.