Two-factor authentication
Enter the 6-digit code from your authenticator app.
Didn't receive a code? Resend
Classic card
darkCentered 6-digit code card with a verify action and a resend link.
API Reference
Catalog metadata for this block. Install copies the source into your project.
npx cronus-ui add otp| Field | Type | Default | Description |
|---|---|---|---|
slug* | string | "otp" | Registry item id. Passed to cronus-ui add. |
name* | string | "Two-Factor Code" | Display name shown in the gallery. |
description* | string | "A two-factor authentication card with a six-digit one-time code entry." | Short summary of what the block covers. |
variants | { id: string; name: string; description: string }[] | ["classic", "split"] | Alternate layouts. Install a look with npx cronus-ui add <slug>--<id>. Omitted when the block has a single default. |
Variants
Every published look for this block.
| Id | Name | Description |
|---|---|---|
classic | Classic card | Centered 6-digit code card with a verify action and a resend link. |
split | Split panel | Brand gradient panel with a customer testimonial beside the 6-digit code form. |