Public demo

UI kit · Advanced inputs

UI kitGeneric UI

OTP fields, date & time, color wells, loading submit, character counts—patterns common in auth, billing, and theming UIs.

Higher-effort inputs beyond a single text box: segmented OTP, native datetime affordances, palette pickers, and async button states.

UI showcase

Static composition for reference—swap in generated output when your pipeline is connected. Everything below is local markup only.

Aligns with Input OTP, Date Picker, and loading Button patterns from popular React kits.

Why this demo works

  • Covers verification, scheduling, and theme customization flows in one reference.

Suggested use cases

  • MFA, invoices, brand / theme pickers

What's included

  • Six-slot one-time code row
  • Date and time field pair
  • Semantic color well strip
  • Primary button with inline loading spinner
  • Optional character count on textarea

Editable in Frontuna

react-day-picker, input-otp, or native datetime-local depending on locale needs.

Use this page as a briefing artifact: copy structure, swap copy, and connect your components—no fake generated code required.

Build notes

  • OTP should use inputmode="numeric" and paste handling in production.