Docs / Guide: Sign-in & Account Pages
The smallest pages in the product, held to the highest standard.
The Login block is a Card with two fields and one primary button, and that is the whole page’s ambition. Every element added to a sign-in page — a banner, a testimonial, a “what’s new” — is measured against the only metric that matters here: does the person get in?
Errors on auth pages are written for someone who is already frustrated: say what failed and what to try, never which half of the credential was wrong. “Email or password did not match” is both kinder and safer.
If the account-creation form rejects passwords, the rules sit in the Field hint before the first keystroke, not in an error after the third attempt. Length is the rule that matters; composition rules mostly manufacture Post-it notes.
Offer the platform’s help: autocomplete attributes (email, current-password, new-password, one-time-code) and the Input OTP part for codes. The browser and the password manager are part of your interface whether you design for them or not.
Sign-in succeeds into the App Shell, not into a celebration. If the session was heading somewhere — a deep link, an invite — it lands there. The welcome-back toast is the most that should mark the occasion.
Getting Started · Theming · Dark Mode · Accessibility · Installation · JavaScript · Guide: Building a Dashboard · Guide: Building a Settings Page · Guide: Building a Pricing Page · Why Vanilla · The Mold · Anatomy of a Part · Coming from Tailwind · FAQ · Changelog