Live preview from the library's source
Install
From shadcn/ui
npx shadcn@latest add https://ui.shadcn.com/r/styles/new-york-v4/login-03.jsonFrom this collection
npx shadcn@latest add https://allcomps.vercel.app/r/ui-shadcn--login-03.jsonCode
import { GalleryVerticalEnd } from "lucide-react"
import { LoginForm } from "@/registry/new-york-v4/blocks/login-03/components/login-form"
export default function LoginPage() {
return (
<div className="flex min-h-svh flex-col items-center justify-center gap-6 bg-muted p-6 md:p-10">
<div className="flex w-full max-w-sm flex-col gap-6">
<a href="#" className="flex items-center gap-2 self-center font-medium">
<div className="flex size-6 items-center justify-center rounded-md bg-primary text-primary-foreground">
<GalleryVerticalEnd className="size-4" />
</div>
Acme Inc.
</a>
<LoginForm />
</div>
</div>
)
}
Other auth screens
The same kind of component from the other libraries in the collection.