Sign Up Account

Enter your personal data to create your account.

Already have an account?

By continuing you agree to our Terms of Service and Privacy Policy.

Use an email containing fail to see the error state

Controls

variant

defaultMode

title

subtitle

headline

description

accent

panelColor

glowColor

radiuspx

showRememberMemagicLink

termsHref

privacyHref

Sign In / Sign Up

Sign in and sign up sections built on shadcn inputs: a split onboarding panel, a spotlight card and a multi-step flow with code verification. Animated mode switch, inline validation, loading, success and error states.

Open in v0

$ pnpm dlx shadcn@latest add @tweenly/auth

import { AuthSection } from "@/components/auth"

export function Demo() {
  return (
    <AuthSection
      termsHref="#terms"
      privacyHref="#privacy"
      providers={["google", "github"]}
      onSubmit={async (values) => { await signUp(values) }}
    />
  )
}

Updates live as you change the controls. Only non-default props are included.