Authentication

Sign-in and sign-up screens are small, focused and calm. They are often the first screen a person sees, so they must work with password managers, screen readers and one hand.

Layout

• A single centred column, no more than 400px wide on large screens, with the product logo above the heading.
• One primary action per screen. Secondary routes (create account, forgot password) are links.
• Keep the product’s own identity: Stance provides the fields and buttons, not the page design.

Fields

• Use the correct input types and autocomplete values so password managers and autofill work: username, current-password, new-password, one-time-code.
• Let people show the password. Never block paste.
• Show password rules before the person types, not only after an error.
• Do not rely on puzzles or memory tests to prove the person is human (WCAG 3.3.8).

Errors

For security, a failed sign-in says “Email or password is incorrect” without revealing which one. Show it in an inline alert above the form and keep the email filled in.

Components