Forms

Input OTP

One-time password input with segmented fields.

Input OTP

Segmented one-time password input.

[data-input-otp] { --nojs-bg: white !important; --nojs-fg: black !important; background-color: var(--nojs-bg) !important; color: var(--nojs-fg) !important; caret-color: var(--nojs-fg) !important; letter-spacing: .25em !important; text-align: center !important; border: 1px solid var(--nojs-fg) !important; border-radius: 4px !important; width: 100% !important; } @media (prefers-color-scheme: dark) { [data-input-otp] { --nojs-bg: black !important; --nojs-fg: white !important; } }

API Reference

Prop	Type	Default	Description
`maxLength`	`number`	--	Number of OTP slots.
`value`	`string`	--	Controlled value.
`onChange`	`(value: string) => void`	--	Called on value change.

Input

Single-line text input with label and error state.

Usage

import { InputOTP } from "@doss/tetris-ui";

Input OTP

Input OTP

API Reference

Related

Usage