Form blocks

Tracks the cursor and paints a soft radial spotlight plus a highlighted border on hover, wraps around any shadcn/ui Card content. Needs next-themes for the dark/light gradient color swap, strip that if the project has no theme provider.

Wires react-hook-form and zod validation into the Input, Select, and Textarea primitives with accessible error messages tied to each field. Skip this and use plain Field and Label if the form has no validation rules to enforce.

Single-card login form with email and password only. Good default for internal tools where there is no social auth to wire up.

Two-column login with a full-height image on desktop that collapses to a single column on mobile. Swap the placeholder image and company name, the form itself is a separate login-form component pulled from the same source URL.

Centered login card built around one email field plus social login buttons and a legal footer. Use it when the client wants one-click sign-in via Google or Apple instead of a password.

Card-based signup form with name, email, password, and confirm password fields. Swap the field description copy for the client's own password rules and privacy language.

Compact signup form built around one email field with Apple and Google buttons below it. Use for low-friction signups where password creation happens later, after email verification.

Self-contained checkout card with a monthly/annual pill toggle that updates the displayed price, and a card/bank payment method tab switch. Static mockup only, wire the buttons to a real payment processor before shipping to a client.

Interactive rate card where dragging each usage slider recalculates the line cost and the monthly total live, mirrors how Stripe visualizes usage-based pricing. Best on a usage-billing or API-product pricing page, overkill for a flat-fee service business.

Six-box one-time-code input that auto-advances focus as digits are typed and steps back on backspace. Use for a real 3D Secure or SMS step, not as a fake trust signal, and connect it to an actual verification flow before shipping.