Auth Page Template

What this template is for

An auth page template helps product teams and developers sketch the first screen many users see: login, signup, and account creation. This template includes separate login and register pages, OAuth buttons for Google and GitHub, email and password fields, primary actions, helper links, and terms text. Use it to align on the structure of an authentication flow before building the real UI or handing the screen to a designer.

When to use this template

• Plan the login and signup experience for a SaaS product before implementation starts.
• Compare OAuth-first vs. email-first account creation flows with your product team.
• Sketch a low-fidelity authentication screen for a design review or stakeholder demo.
• Document the fields, helper links, and legal text required for a production auth form.
• Create a starting point for user testing around signup friction and onboarding drop-off.

How to use it

1. 1Start with the login page and confirm the main sign-in methods: OAuth, email, or both.
2. 2Add input fields only for the information required at this step.
3. 3Place the primary action button near the form and make secondary links visually lighter.
4. 4Add a register page or account creation state so the full auth loop is visible.
5. 5Include forgotten password, terms, and privacy links where users expect to find them.
6. 6Review the flow for friction: every field should have a clear reason to exist.

Quick example