Formulare

Verification Code Card

Ein umrahmter Verifizierungsschritt mit einem beschrifteten Codefeld, einer Verifizierungsschaltfläche, die erst entsperrt wird, wenn der Code vollständig ist, und einem Link zum erneuten Senden bei einem Countdown.

Enter verification code

We sent a 6-digit code to (415) 555-0142.

Verification code

Resend code in 30s

Verification Code Card verwenden

Teste die Vorschau mit Maus und Tastatur. Prüfe den sichtbaren Fokus und das Layout auf schmalen Bildschirmen in deiner eigenen Seite. Nenne deinem Agenten die Nummer oder den Bezeichner, um diese Komponente abzurufen.

Eigenschaften: length, accentColor, resendSeconds, autoSubmit, title

Welche Frameworks sind verfügbar?

Der Katalog enthält diese Versionen: react, vue, svelte, astro, html. Die Vorschau auf dieser Seite verwendet React.

Wie greife ich auf die Implementierung zu?

Code, Framework-Versionen und Installationsbefehle sind im Arbeitsbereich oben verfügbar.

Verbinde deinen Agenten

Ähnliche Komponenten

2010Paired Code Split ViewFormulareEin Verifizierungsschritt mit geteiltem Bildschirm, dessen Codefelder in Paaren mit Bindestrichen dazwischen gruppiert sind und sich selbst senden, sobald das letzte Feld ausgefüllt ist.

2064Tall Code KeypadFormulareEin randloses Verifizierungsformular, das auf ungewöhnlich hohen Codefeldern basiert, mit Ziffern, die mit einem kurzen Sprung landen, und einer gedrückten Rücktaste, die alles löscht.

1925Branded Code PanelFormulareEin zentriertes Verifizierungsfeld unter einem kleinen Markenschloss, bei dem ein abgelehnter Code die Zeile einmal schüttelt, sie löscht und die Hände wieder auf das erste Kästchen konzentriert.

1938Code cover cardFormulareEine breite Verifizierungskarte mit dem Codeformular auf der einen Seite und einem Abdeckfeld auf der anderen Seite, das bei der Eingabe von Ziffern einen Fortschrittsbalken ausfüllt.

1957Field with status iconFormulareEine beschriftete Eingabe, an deren hinterer Kante ein kleines Häkchen- oder Warnsymbol angezeigt wird, das ausgeblendet wird, sobald sich die Gültigkeit des Felds ändert, ohne dass sich das Layout ändert.

1964Focus Guard FormFormulareEin Formular, das bei einer fehlgeschlagenen Übermittlung die Übermittlung abbricht, den Tastaturfokus direkt auf das erste ungültige Feld verschiebt und das Problem für Benutzer von Bildschirmleseprogrammen ankündigt.