From 0e17efdf9393536f159e38a4861fbd9f14c7dd95 Mon Sep 17 00:00:00 2001 From: Bryce Kalow Date: Wed, 26 Nov 2025 14:58:08 -0600 Subject: [PATCH 1/8] Add docs for Vercel provider --- .../social-connections/all-providers.mdx | 6 ++ .../social-connections/vercel.mdx | 69 +++++++++++++++++++ public/images/logos/auth_providers/vercel.svg | 3 + 3 files changed, 78 insertions(+) create mode 100644 docs/guides/configure/auth-strategies/social-connections/vercel.mdx create mode 100644 public/images/logos/auth_providers/vercel.svg diff --git a/docs/guides/configure/auth-strategies/social-connections/all-providers.mdx b/docs/guides/configure/auth-strategies/social-connections/all-providers.mdx index 75caeb3104..a75b102d2e 100644 --- a/docs/guides/configure/auth-strategies/social-connections/all-providers.mdx +++ b/docs/guides/configure/auth-strategies/social-connections/all-providers.mdx @@ -138,6 +138,12 @@ Clerk provides a wide range of social providers to ease your user's sign-up and --- + - [Vercel](/docs/guides/configure/auth-strategies/social-connections/vercel) + - Add Vercel as an authentication provider for your Clerk app. + - ![](/docs/images/logos/auth_providers/vercel.svg) + + --- + - [X/Twitter v2](/docs/guides/configure/auth-strategies/social-connections/x-twitter) - Add X (Twitter v2) as an authentication provider for your Clerk app. - ![](/docs/images/logos/auth_providers/x-twitter.svg) diff --git a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx new file mode 100644 index 0000000000..214277e9af --- /dev/null +++ b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx @@ -0,0 +1,69 @@ +--- +title: Add Vercel as a social connection +description: Learn how to allow users to sign up and sign in to your Clerk app with their Vercel account using OAuth. + +--- + + + +Enabling OAuth with [Vercel](https://vercel.com/docs/sign-in-with-vercel) allows your users to sign up and sign in to your Clerk app with their Vercel account. + +## Configure for your development instance + +For _development instances_, Clerk uses preconfigured shared OAuth credentials and redirect URIs—no other configuration is needed. + +1. In the Clerk Dashboard, navigate to the [**SSO connections**](https://dashboard.clerk.com/~/user-authentication/sso-connections) page. +1. Select **Add connection** and select **For all users**. +1. In the **Choose provider** dropdown, select **Vercel**. +1. Select **Add connection**. + +## Configure for your production instance + +For _production instances_, you must provide custom credentials. + +To make the setup process easier, it's recommended to keep two browser tabs open: one for the [Clerk Dashboard](https://dashboard.clerk.com/~/user-authentication/sso-connections) and one for your [Vercel team settings](https://vercel.com/account). + + + ### Enable Vercel as a social connection in Clerk + + 1. In the Clerk Dashboard, navigate to the [**SSO connections**](https://dashboard.clerk.com/~/user-authentication/sso-connections) page. + 1. Select **Add connection** and choose **For all users**. + 1. In the **Choose provider** dropdown, select **Vercel**. + 1. Ensure that both **Enable for sign-up and sign-in** and **Use custom credentials** are toggled on. + 1. Save the **Authorization Callback URL** somewhere secure. Keep the modal and page open. + + ### Create a Vercel app + + 1. In your Vercel dashboard, navigate to your team's **Settings** tab. + 1. Scroll down and select **Apps**, then select **Create**. + 1. Enter a **Name** and **Slug** for your app. + 1. Optionally, upload a logo for your app. + 1. Select **Save**. + 1. Under **Client Authentication Method**, select the appropriate method for your app. For server-side applications, `client_secret_basic` or `client_secret_post` are recommended. + 1. Select **Generate** to create a client secret. Save the **Client ID** and **Client Secret** somewhere secure. + 1. Scroll to **Authorization Callback URLs** and add the **Authorization Callback URL** you saved from the Clerk Dashboard. + 1. Navigate to the **Permissions** tab and enable the scopes your app needs (e.g., `openid`, `email`, `profile`). + 1. Select **Save**. + + ### Set the Client ID and Client Secret in the Clerk Dashboard + + + + ### Test your connection + + + + diff --git a/public/images/logos/auth_providers/vercel.svg b/public/images/logos/auth_providers/vercel.svg new file mode 100644 index 0000000000..72948d01a7 --- /dev/null +++ b/public/images/logos/auth_providers/vercel.svg @@ -0,0 +1,3 @@ + + + From e037c0f35ad4e43ec5e9ed10330ca824b969d4f1 Mon Sep 17 00:00:00 2001 From: Bryce Kalow Date: Tue, 2 Dec 2025 14:22:15 -0600 Subject: [PATCH 2/8] Apply suggestion from @brkalow --- .../configure/auth-strategies/social-connections/vercel.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx index 214277e9af..26f914c9c5 100644 --- a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx +++ b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx @@ -55,7 +55,7 @@ To make the setup process easier, it's recommended to keep two browser tabs open 1. Under **Client Authentication Method**, select the appropriate method for your app. For server-side applications, `client_secret_basic` or `client_secret_post` are recommended. 1. Select **Generate** to create a client secret. Save the **Client ID** and **Client Secret** somewhere secure. 1. Scroll to **Authorization Callback URLs** and add the **Authorization Callback URL** you saved from the Clerk Dashboard. - 1. Navigate to the **Permissions** tab and enable the scopes your app needs (e.g., `openid`, `email`, `profile`). + 1. Navigate to the **Permissions** tab and enable the required scopes: `openid`, `email`, `profile`, and `offline_access`. 1. Select **Save**. ### Set the Client ID and Client Secret in the Clerk Dashboard From 4758c9650d41334babacbc7c30cae64050b8e1a2 Mon Sep 17 00:00:00 2001 From: Bryce Kalow Date: Tue, 2 Dec 2025 16:00:08 -0600 Subject: [PATCH 3/8] format --- .../configure/auth-strategies/social-connections/vercel.mdx | 1 - 1 file changed, 1 deletion(-) diff --git a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx index 26f914c9c5..f27296c870 100644 --- a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx +++ b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx @@ -66,4 +66,3 @@ To make the setup process easier, it's recommended to keep two browser tabs open - From e1632173cab47282f65bd257ca696bdb4667205f Mon Sep 17 00:00:00 2001 From: Bryce Kalow Date: Tue, 2 Dec 2025 16:04:22 -0600 Subject: [PATCH 4/8] exclude file from manifest check --- scripts/build-docs.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/scripts/build-docs.ts b/scripts/build-docs.ts index 4c91232738..3390c17a96 100644 --- a/scripts/build-docs.ts +++ b/scripts/build-docs.ts @@ -204,6 +204,7 @@ async function main() { 'guides/configure/auth-strategies/social-connections/twitter.mdx': ['doc-not-in-manifest'], 'guides/configure/auth-strategies/social-connections/x-twitter.mdx': ['doc-not-in-manifest'], 'guides/configure/auth-strategies/social-connections/xero.mdx': ['doc-not-in-manifest'], + 'guides/configure/auth-strategies/social-connections/vercel.mdx': ['doc-not-in-manifest'], 'guides/development/upgrading/upgrading-from-v2-to-v3.mdx': ['doc-not-in-manifest'], 'guides/organizations/create-orgs-for-users.mdx': ['doc-not-in-manifest'], 'getting-started/quickstart/setup-clerk.mdx': ['doc-not-in-manifest'], From b69bf6c763248d749f0694405d60d3362c64cd59 Mon Sep 17 00:00:00 2001 From: Bryce Kalow Date: Tue, 2 Dec 2025 22:38:39 -0600 Subject: [PATCH 5/8] Update docs/guides/configure/auth-strategies/social-connections/vercel.mdx Co-authored-by: Sarah Soutoul --- .../configure/auth-strategies/social-connections/vercel.mdx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx index f27296c870..0ceca312ce 100644 --- a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx +++ b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx @@ -49,8 +49,7 @@ To make the setup process easier, it's recommended to keep two browser tabs open 1. In your Vercel dashboard, navigate to your team's **Settings** tab. 1. Scroll down and select **Apps**, then select **Create**. - 1. Enter a **Name** and **Slug** for your app. - 1. Optionally, upload a logo for your app. + 1. Enter a **Name** and **Slug** for your app. Optionally, upload a logo. 1. Select **Save**. 1. Under **Client Authentication Method**, select the appropriate method for your app. For server-side applications, `client_secret_basic` or `client_secret_post` are recommended. 1. Select **Generate** to create a client secret. Save the **Client ID** and **Client Secret** somewhere secure. From d3f5b09b6e02ae8a145bbb54d82652a7b0f2eea4 Mon Sep 17 00:00:00 2001 From: Bryce Kalow Date: Tue, 2 Dec 2025 22:43:37 -0600 Subject: [PATCH 6/8] Address PR feedback --- .../configure/auth-strategies/social-connections/vercel.mdx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx index 0ceca312ce..e8f7930009 100644 --- a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx +++ b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx @@ -47,13 +47,13 @@ To make the setup process easier, it's recommended to keep two browser tabs open ### Create a Vercel app - 1. In your Vercel dashboard, navigate to your team's **Settings** tab. + 1. In your [Vercel dashboard](https://vercel.com), navigate to your team's **Settings** tab. 1. Scroll down and select **Apps**, then select **Create**. 1. Enter a **Name** and **Slug** for your app. Optionally, upload a logo. 1. Select **Save**. - 1. Under **Client Authentication Method**, select the appropriate method for your app. For server-side applications, `client_secret_basic` or `client_secret_post` are recommended. - 1. Select **Generate** to create a client secret. Save the **Client ID** and **Client Secret** somewhere secure. 1. Scroll to **Authorization Callback URLs** and add the **Authorization Callback URL** you saved from the Clerk Dashboard. + 1. Navigate to the **Authentication** tab and under **Client Authentication Method**, select the appropriate method for your app. For server-side applications, `client_secret_basic` or `client_secret_post` are recommended. + 1. Select **Generate** to create a client secret. Save the **Client ID** and **Client Secret** somewhere secure. 1. Navigate to the **Permissions** tab and enable the required scopes: `openid`, `email`, `profile`, and `offline_access`. 1. Select **Save**. From 9112d878ec2dc5ecb123a10fe79b74bee175a5f4 Mon Sep 17 00:00:00 2001 From: Bryce Kalow Date: Wed, 3 Dec 2025 11:54:49 -0600 Subject: [PATCH 7/8] Update docs/guides/configure/auth-strategies/social-connections/vercel.mdx Co-authored-by: Sarah Soutoul --- .../configure/auth-strategies/social-connections/vercel.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx index e8f7930009..ecbe01472e 100644 --- a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx +++ b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx @@ -52,7 +52,7 @@ To make the setup process easier, it's recommended to keep two browser tabs open 1. Enter a **Name** and **Slug** for your app. Optionally, upload a logo. 1. Select **Save**. 1. Scroll to **Authorization Callback URLs** and add the **Authorization Callback URL** you saved from the Clerk Dashboard. - 1. Navigate to the **Authentication** tab and under **Client Authentication Method**, select the appropriate method for your app. For server-side applications, `client_secret_basic` or `client_secret_post` are recommended. + 1. Navigate to the **Authentication** tab and under **Client Authentication Methods**, select the appropriate method for your app. For server-side applications, `client_secret_basic` or `client_secret_post` are recommended. 1. Select **Generate** to create a client secret. Save the **Client ID** and **Client Secret** somewhere secure. 1. Navigate to the **Permissions** tab and enable the required scopes: `openid`, `email`, `profile`, and `offline_access`. 1. Select **Save**. From b2d345e7654df18ce9bed0f752563bcc056fa7e2 Mon Sep 17 00:00:00 2001 From: Bryce Kalow Date: Wed, 3 Dec 2025 12:06:07 -0600 Subject: [PATCH 8/8] Tweak wording --- .../configure/auth-strategies/social-connections/vercel.mdx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx index ecbe01472e..15c72db77c 100644 --- a/docs/guides/configure/auth-strategies/social-connections/vercel.mdx +++ b/docs/guides/configure/auth-strategies/social-connections/vercel.mdx @@ -51,10 +51,11 @@ To make the setup process easier, it's recommended to keep two browser tabs open 1. Scroll down and select **Apps**, then select **Create**. 1. Enter a **Name** and **Slug** for your app. Optionally, upload a logo. 1. Select **Save**. - 1. Scroll to **Authorization Callback URLs** and add the **Authorization Callback URL** you saved from the Clerk Dashboard. + 1. Save the **Client ID** somewhere secure. + 1. Scroll to **Authorization Callback URLs** and add the Authorization Callback URL you saved from the Clerk Dashboard. 1. Navigate to the **Authentication** tab and under **Client Authentication Methods**, select the appropriate method for your app. For server-side applications, `client_secret_basic` or `client_secret_post` are recommended. - 1. Select **Generate** to create a client secret. Save the **Client ID** and **Client Secret** somewhere secure. 1. Navigate to the **Permissions** tab and enable the required scopes: `openid`, `email`, `profile`, and `offline_access`. + 1. Select **Generate** to create a client secret. Save the **Client Secret** somewhere secure. 1. Select **Save**. ### Set the Client ID and Client Secret in the Clerk Dashboard