<SignIn />

Usage

import { SignIn } from "@/components/auth/sign-in"

export function SignInDemo() {
  return <SignIn />
}

The password starts masked. Its localized show/hide button changes only the field presentation, so the submitted password value stays unchanged.

Invalid email addresses show an error beside the email field before submission. If email or username sign-in fails, the form keeps your password and shows the server error inside the form. These failures do not also show a toast. Accounts that require email verification go to the verification page.

Installation

npx shadcn@latest add @better-auth-ui/sign-in

Props