BlocksAuthLogin 01

Login 01

About this block

Login 01 is a split-screen authentication page with a decorative gradient panel on the left and an email/password login form with OAuth provider buttons on the right. Built with shadcn/ui Form, Input, and Button components, it includes client-side validation and handles both credential and OAuth login flows. The form is static — you connect it to your authentication provider (Supabase, NextAuth, or any OAuth service) by wiring the form actions and OAuth redirect handlers.

When to use it

  • Projects that need a polished login page without the setup overhead of a full auth block
  • Applications where email/password and social OAuth are both required from day one
  • Products where the split-screen layout matches an existing design system or brand aesthetic
  • Any Next.js project where you want a production-ready login UI to wire to your own auth logic

Notes

For a fully wired Supabase Auth login page with PKCE callback, OAuth support, and session handling out of the box, use Login 02 (Pro) instead.

Frequently asked questions

Is Login 01 wired to a real authentication provider?
No. It's a UI-only login page — you connect the form actions and OAuth redirect handlers to Supabase, NextAuth, or any provider yourself.
What handles the form validation?
react-hook-form with zod schema validation, wired through @hookform/resolvers — both client-side, no server round-trip required to validate input shape.
Is there a version that comes pre-wired to Supabase?
Yes — Login 02 (Pro) includes a fully wired Supabase Auth flow with PKCE callback and session handling out of the box.
Shadcn/ui components
buttoninputlabelsocial-icons
Connected toStatic — no backend wired