Sign-in Options

Clerk provides a large selection of options for managing your user's sign-in experience. Clerk makes it easy to customize the way signing in works in your application, whether your users will be authenticating with Passwords, Magic Links, One-time Passcodes, or through a Social OAuth provider.

You can create your sign-in flow with Clerk-provided Hosted UIs, Clerk Custom Components, or by using the methods of the SignIn object to create your own custom sign-in flow.

When a new application is created, you will be presented with the following screen:

From this menu, you can select the key sign-in information that your users will be providing. There are three main sections:

Identifiers are how your application recognizes an individual user.

The authentication refers to whether your application will rely on passwords or a passwordless method of authentication.

Connected accounts are third-party sources used to authenticate your users.

Once you've selected the first methods you would like to try, click FINISH. If you're not totally sure about what you want to use, don't worry. You can change any of these settings from the Clerk Dashboard later on.

From the dashboard, select Sign-up & Sign-in to see a preview of your hosted sign-in page, provided by Clerk. Because we configured our app to have an Email identifier, a Password authentication strategy, and Social Login with Google our Sign-in preview will look like this:

If your initial sign-in choices aren't working out (or if you want to add more options for your users), you can make changes by navigating to the User & Authentication section of the Dashboard.

Lets take a look at a few of the different sign-in options and how they could be combined to fit your application's needs.

Let's say I've decided to add a multi-factor authentication step to my sign-in flow. I would like my user to recieve an email with a magic link that they can click which authenticate their session. Clerk makes this incredibly easy to implement. Simply:

1. Toggle on Email verification link under the Authentication factors section.

2. Select the gear symbol next to Email address to open up the email settings. From there simply check the box next to Email verification link.

And that's it, when your user provides their email address, they'll be sent a magic link that will route them back to the application and authenticate their session.

Let's imagine that our application is going to be exclusively used by people on their phones. We want to collect the user's phone number as our identifier, and we want the user to sign in to our app by entering a one-time code sent via SMS to the user's device.

1. We first need to turn on Phone as one of our sign-in options. We can do this by selecting Phone from the Dashboard under the Email & Phone section.

2. Click the gear icon next to Phone to open the Phone settings menu. Toggle on Sign-in.

3. In the Authentication factors section, toggle on SMS verification code. Don't forget to hit Apply changes!

Now when a user signs in to your application, they will do so through a flow that looks like this:

The user provides their phone number.

The user is sent a One-time passcode (OTP) via SMS message, and will be shown this screen to provide it.

Once the user enters the code, they'll be redirected and authenticated in your application.

For our third example, let's say that I've decided that I want all of my users to sign in with Social OAuth or with a connected Web3 account.

1. We won't need an email or password, so we can turn those off using the Dashboard:

2. Go the the Social login section of the Dashboard and select the OAuth providers your that will be used to authenticate your users. We're going to select Google and Twitter.

3. Navigate to the Web3 section and toggle on the Web3 provider.

And your all set. Users can now authenticate with Google, Twitter or MetaMask.

These are just a few of the combinations of the authentication options Clerk provides. Clerk makes it possible to build sign-in that works exactly the way you want it for your application.