Search

Search components and blocks

Sign in

Auth Blocks

Sign-in, sign-up, and account flows — login forms, OTP/passcode entry, and password reset built on shadcn primitives.

Split Login Modal

Pro

The login twin of the Split Sign-up Modal, built from the same file so the two stay visually identical: the same Center Morph unfold, image slot and email flow. Continue with email collapses the Google button and the email field glides up, then password, Forgot password?, Log in and a back link open out beneath it, and a confirmation closes the modal. Pass onSwitch to either modal to show a link to the other. Sample copy is for Relay, a fictional API monitor.

pnpm dlx shadcn@latest add @ditherui/split-login-modal

Props

mediaReactNodeplaceholder
onGoogle() => void—
showGooglebooleantrue
onGithub() => void— (button hidden)
showEmailbooleantrue
onEmail(email: string, password: string) => void—
onMagicLink(email: string) => Promise<string | null>— (passwordless when set)
onForgotPassword() => void—
copyPartial<AuthCopy>—
footerReactNodeintegrations strip
onSwitch() => void—

Suggested components