useSignUp() and useSignIn()

If our Clerk Hosted Pages and Prebuilt Components don't meet your needs, you can build a fully custom sign-up or sign-in flow using the React hooks useSignUp() and useSignIn() respectively.

The useSignUp() hook gives you access to the SignUp object and its available methods in order to build a custom sign-up flow. The SignUp object will also contain the state of the sign-up attempt that is currently in progress, which gives you the ability to examine all the details and act accordingly.

Getting access to the SignUp object from inside one of your components is easy. Note that the useSignUp() hook can only be used inside a <ClerkProvider/> context.

The following example accesses the SignUp object to check the current sign-up attempt's status.

In a more involved example, we show an approach to create a custom form for registering users, in this case with a Password strategy.

The useSignIn() hook gives you access to the SignIn object and its available methods in order to build a custom sign-in flow. The SignIn object will also contain the state of the sign-in attempt that is currently in progress, which gives you the ability to example all the details and act accordingly.

Getting access to the SignIn object from inside one of your components is easy. Note that the useSignIn() hook can only be used inside a <ClerkProvider/> context.

The following example accesses the SignIn object to check the current sign-in attempt's status.

In a more involved example, we show an approach to create a custom form for signing in users, in this case with a Password strategy.