Create your account
Welcome! Please fill in the details to get started.
or
Already have an account?
Secured byclerk
Overview
A complete sign-up form using Clerk Core 3's useSignUp() hook. Two steps: registration (name, email, password) and email verification via 6-digit OTP. Includes live password requirements and bot protection via captcha.
Installation
npx shadcn@latest add "https://elements.crfrst.dev/r/clerk-sign-up"Usage
import { ClerkSignUp } from "@/components/elements/clerk-sign-up";
export default function RegisterPage() {
return <ClerkSignUp redirectUrl="/dashboard" />;
}Props
| Prop | Type | Default | Description |
|---|---|---|---|
heading | string | "Create your account" | Form heading |
subheading | string | "Welcome! Please fill in the details to get started." | Subheading |
showOAuth | boolean | true | Show social login buttons |
redirectUrl | string | "/" | Where to redirect after sign up |
signInUrl | string | "/sign-in" | Link to sign in page |
afterSSOUrl | string | "/sso-callback" | OAuth callback page URL |
Features
- Multi-step form (registration -> email verification)
- 6-digit OTP input with auto-focus and paste support
- Live password requirements indicator
- Social OAuth buttons (Google, GitHub)
- Resend verification code
- Bot protection via Clerk captcha