OTPInput Custom Attributes

Updated on Jun 22, 2026

The inputAttributes prop accepts a plain object whose key-value pairs are applied as HTML attributes to every individual input cell rendered by the OTPInput.

A common use case is setting autocomplete="one-time-code" to enable browser autofill for OTP codes delivered via SMS.

tsx

<OTPInput inputAttributes={{ autoComplete: 'one-time-code' }} />

The following example demonstrates custom attributes in action. Inspect the rendered <input> elements in your browser's DevTools to verify the attribute is applied.

Change Theme

Theme

Loading ...

Suggested Links

• API Reference of the OTPInput Props