New to Kendo UI for Angular? Start a free 30-day trial

OTPInputComponent

Updated on Feb 6, 2026

Represents the Kendo UI OTP Input component for Angular.

Use the OTP Input to enter one-time passwords or verification codes.

html

<kendo-otpinput type="number" [(ngModel)]="otpValue"></kendo-otpinput>

Selector

kendo-otpinput

Accessible in templates as #kendoOTPInputInstance="kendoOTPInput"

Name	Type	Default	Description
disabled	`boolean`	`false`	When `true`, disables the OTPInput.
fillMode	`InputFillMode`		Sets the background and border styles of the OTP Input. The default value is set by the Kendo theme.
groupLength	`number \| number[]`		Sets the length of the groups. If you set a number, all groups have the same length. If you set an array, each group can have a different length.
inputAttributes	`{[key: string]: string}`		Sets the HTML attributes of the inner input element. You cannot change attributes that are required for the component to work.
length	`number`	`4`	Sets the total number of input fields.
placeholder	`string`		Sets the placeholder for the input fields.
readonly	`boolean`	`false`	When `true`, sets the OTPInput to read-only mode.
rounded	`InputRounded`		Sets the border radius of the OTP Input. The default value is set by the Kendo theme.
separator	`string \| OTPSeparatorIcon`		Sets the separator between groups of input fields. You can use this only when `groupLength` is set.
size	`InputSize`		Sets the padding of the input fields. The default value is set by the Kendo theme.
spacing	`boolean`	`true`	Sets whether the input fields are separate or adjacent.
type	`OTPInputType`	`'text'`	Sets the input type.
value	`string`		Sets the value of the component. Unfilled input fields are represented with а space.

Name Type Description

Name	Type	Description
blur	`EventEmitter<any>`	Fires when the user blurs the OTP Input.
focus	`EventEmitter<any>`	Fires when the user focuses the OTP Input.
valueChange	`EventEmitter<any>`	Fires when the user changes the value. This event does not fire when you change the value programmatically or through form bindings.