diff --git a/.changeset/nine-squids-buy.md b/.changeset/nine-squids-buy.md
new file mode 100644
index 0000000000..f92e2fae0c
--- /dev/null
+++ b/.changeset/nine-squids-buy.md
@@ -0,0 +1,14 @@
+---
+"@clerk/localizations": minor
+"@clerk/clerk-js": minor
+"@clerk/nextjs": minor
+"@clerk/clerk-react": minor
+"@clerk/types": minor
+---
+
+Show `Join waitlist` promt from `<SignIn />` component when mode is `waitlist`
+Change the text in `RestrictedAccess` component when mode is `waitlist`
+Introduce `<Waitlist />` component to allow users to join in the waitlist via email
+Introduce `joinWaitlist` method in `clerk` class
+Introduce `redirectToWaitlist` function in `clerk` class to allow user to redirect to waitlist page
+
diff --git a/packages/chrome-extension/src/__tests__/__snapshots__/exports.test.ts.snap b/packages/chrome-extension/src/__tests__/__snapshots__/exports.test.ts.snap
index 5926a52cb7..460d9627d3 100644
--- a/packages/chrome-extension/src/__tests__/__snapshots__/exports.test.ts.snap
+++ b/packages/chrome-extension/src/__tests__/__snapshots__/exports.test.ts.snap
@@ -27,6 +27,7 @@ exports[`public exports should not include a breaking change 1`] = `
   "SignedOut",
   "UserButton",
   "UserProfile",
+  "Waitlist",
   "useAuth",
   "useClerk",
   "useEmailLink",
diff --git a/packages/clerk-js/src/core/__tests__/clerk.redirects.test.ts b/packages/clerk-js/src/core/__tests__/clerk.redirects.test.ts
index 3d8bd18413..a87df11c5d 100644
--- a/packages/clerk-js/src/core/__tests__/clerk.redirects.test.ts
+++ b/packages/clerk-js/src/core/__tests__/clerk.redirects.test.ts
@@ -36,6 +36,7 @@ const mockDisplayConfigWithSameOrigin = {
   homeUrl: 'http://test.host/home',
   createOrganizationUrl: 'http://test.host/create-organization',
   organizationProfileUrl: 'http://test.host/organization-profile',
+  waitlistUrl: 'http://test.host/waitlist',
 } as DisplayConfig;
 
 const mockDisplayConfigWithDifferentOrigin = {
@@ -45,6 +46,7 @@ const mockDisplayConfigWithDifferentOrigin = {
   homeUrl: 'http://another-test.host/home',
   createOrganizationUrl: 'http://another-test.host/create-organization',
   organizationProfileUrl: 'http://another-test.host/organization-profile',
+  waitlistUrl: 'http://another-test.host/waitlist',
 } as DisplayConfig;
 
 const mockUserSettings = {
@@ -96,7 +98,7 @@ describe('Clerk singleton - Redirects', () => {
 
   afterEach(() => mockNavigate.mockReset());
 
-  describe('.redirectTo(SignUp|SignIn|UserProfile|AfterSignIn|AfterSignUp|CreateOrganization|OrganizationProfile)', () => {
+  describe('.redirectTo(SignUp|SignIn|UserProfile|AfterSignIn|AfterSignUp|CreateOrganization|OrganizationProfile|Waitlist)', () => {
     let clerkForProductionInstance: Clerk;
     let clerkForDevelopmentInstance: Clerk;
 
@@ -189,6 +191,13 @@ describe('Clerk singleton - Redirects', () => {
         expect(mockNavigate.mock.calls[0][0]).toBe('/organization-profile');
         expect(mockNavigate.mock.calls[1][0]).toBe('/organization-profile');
       });
+
+      it('redirects to waitlitUrl', async () => {
+        await clerkForDevelopmentInstance.redirectToWaitlist();
+        expect(mockNavigate).toHaveBeenCalledWith('/waitlist', {
+          windowNavigate: expect.any(Function),
+        });
+      });
     });
 
     describe('when redirects point to different origin urls', () => {
diff --git a/packages/clerk-js/src/core/clerk.ts b/packages/clerk-js/src/core/clerk.ts
index 36ff3a1eef..2fb314d186 100644
--- a/packages/clerk-js/src/core/clerk.ts
+++ b/packages/clerk-js/src/core/clerk.ts
@@ -36,6 +36,7 @@ import type {
   HandleEmailLinkVerificationParams,
   HandleOAuthCallbackParams,
   InstanceType,
+  JoinWaitlistParams,
   ListenerCallback,
   LoadedClerk,
   NavigateOptions,
@@ -61,6 +62,8 @@ import type {
   UserButtonProps,
   UserProfileProps,
   UserResource,
+  WaitlistProps,
+  WaitlistResource,
   Web3Provider,
 } from '@clerk/types';
 
@@ -119,6 +122,7 @@ import {
   EmailLinkErrorCode,
   Environment,
   Organization,
+  Waitlist,
 } from './resources/internal';
 import { warnings } from './warnings';
 
@@ -509,6 +513,18 @@ export class Clerk implements ClerkInterface {
     void this.#componentControls.ensureMounted().then(controls => controls.closeModal('createOrganization'));
   };
 
+  public openWaitlist = (props?: WaitlistProps): void => {
+    this.assertComponentsReady(this.#componentControls);
+    void this.#componentControls
+      .ensureMounted({ preloadHint: 'Waitlist' })
+      .then(controls => controls.openModal('waitlist', props || {}));
+  };
+
+  public closeWaitlist = (): void => {
+    this.assertComponentsReady(this.#componentControls);
+    void this.#componentControls.ensureMounted().then(controls => controls.closeModal('waitlist'));
+  };
+
   public mountSignIn = (node: HTMLDivElement, props?: SignInProps): void => {
     if (props && props.__experimental?.newComponents && this.__experimental_ui) {
       this.__experimental_ui.mount('SignIn', node, props);
@@ -743,6 +759,25 @@ export class Clerk implements ClerkInterface {
     void this.#componentControls?.ensureMounted().then(controls => controls.unmountComponent({ node }));
   };
 
+  public mountWaitlist = (node: HTMLDivElement, props?: WaitlistProps) => {
+    this.assertComponentsReady(this.#componentControls);
+    void this.#componentControls?.ensureMounted({ preloadHint: 'Waitlist' }).then(controls =>
+      controls.mountComponent({
+        name: 'Waitlist',
+        appearanceKey: 'waitlist',
+        node,
+        props,
+      }),
+    );
+
+    this.telemetry?.record(eventPrebuiltComponentMounted('Waitlist', props));
+  };
+
+  public unmountWaitlist = (node: HTMLDivElement): void => {
+    this.assertComponentsReady(this.#componentControls);
+    void this.#componentControls?.ensureMounted().then(controls => controls.unmountComponent({ node }));
+  };
+
   /**
    * `setActive` can be used to set the active session and/or organization.
    */
@@ -964,6 +999,16 @@ export class Clerk implements ClerkInterface {
     return this.buildUrlWithAuth(this.#options.afterSignOutUrl);
   }
 
+  public buildWaitlistUrl(): string {
+    if (!this.environment || !this.environment.displayConfig) {
+      return '';
+    }
+
+    const waitlistUrl = this.#options['waitlistUrl'] || this.environment.displayConfig.waitlistUrl;
+
+    return buildURL({ base: waitlistUrl }, { stringify: true });
+  }
+
   public buildAfterMultiSessionSingleSignOutUrl(): string {
     if (!this.#options.afterMultiSessionSingleSignOutUrl) {
       return this.buildUrlWithAuth(
@@ -1078,6 +1123,13 @@ export class Clerk implements ClerkInterface {
     return;
   };
 
+  public redirectToWaitlist = async (): Promise<unknown> => {
+    if (inBrowser()) {
+      return this.navigate(this.buildWaitlistUrl());
+    }
+    return;
+  };
+
   public handleEmailLinkVerification = async (
     params: HandleEmailLinkVerificationParams,
     customNavigate?: (to: string) => Promise<unknown>,
@@ -1479,6 +1531,9 @@ export class Clerk implements ClerkInterface {
   public getOrganization = async (organizationId: string): Promise<OrganizationResource> =>
     Organization.get(organizationId);
 
+  public joinWaitlist = async ({ emailAddress }: JoinWaitlistParams): Promise<WaitlistResource> =>
+    Waitlist.join({ emailAddress });
+
   public updateEnvironment(environment: EnvironmentResource): asserts this is { environment: EnvironmentResource } {
     this.environment = environment;
     this.#authService?.setEnvironment(environment);
diff --git a/packages/clerk-js/src/core/constants.ts b/packages/clerk-js/src/core/constants.ts
index a3ef8a6844..3905e61f75 100644
--- a/packages/clerk-js/src/core/constants.ts
+++ b/packages/clerk-js/src/core/constants.ts
@@ -36,4 +36,5 @@ export const DEBOUNCE_MS = 350;
 export const SIGN_UP_MODES: Record<string, SignUpModes> = {
   PUBLIC: 'public',
   RESTRICTED: 'restricted',
+  WAITLIST: 'waitlist',
 };
diff --git a/packages/clerk-js/src/core/resources/DisplayConfig.ts b/packages/clerk-js/src/core/resources/DisplayConfig.ts
index 73150b2e37..b2750c1f52 100644
--- a/packages/clerk-js/src/core/resources/DisplayConfig.ts
+++ b/packages/clerk-js/src/core/resources/DisplayConfig.ts
@@ -46,6 +46,7 @@ export class DisplayConfig extends BaseResource implements DisplayConfigResource
   showDevModeWarning!: boolean;
   termsUrl!: string;
   privacyPolicyUrl!: string;
+  waitlistUrl!: string;
 
   public constructor(data: DisplayConfigJSON) {
     super();
@@ -91,6 +92,7 @@ export class DisplayConfig extends BaseResource implements DisplayConfigResource
     this.showDevModeWarning = data.show_devmode_warning;
     this.termsUrl = data.terms_url;
     this.privacyPolicyUrl = data.privacy_policy_url;
+    this.waitlistUrl = data.waitlist_url;
     return this;
   }
 }
diff --git a/packages/clerk-js/src/core/resources/Waitlist.ts b/packages/clerk-js/src/core/resources/Waitlist.ts
new file mode 100644
index 0000000000..dffce0a897
--- /dev/null
+++ b/packages/clerk-js/src/core/resources/Waitlist.ts
@@ -0,0 +1,40 @@
+import type { JoinWaitlistParams, WaitlistJSON, WaitlistResource } from '@clerk/types';
+
+import { unixEpochToDate } from '../../utils/date';
+import { BaseResource } from './internal';
+
+export class Waitlist extends BaseResource implements WaitlistResource {
+  pathRoot = '/waitlist';
+
+  id = '';
+  updatedAt: Date | null = null;
+  createdAt: Date | null = null;
+
+  constructor(data: WaitlistJSON) {
+    super();
+    this.fromJSON(data);
+  }
+
+  protected fromJSON(data: WaitlistJSON | null): this {
+    if (!data) {
+      return this;
+    }
+
+    this.id = data.id;
+    this.updatedAt = unixEpochToDate(data.updated_at);
+    this.createdAt = unixEpochToDate(data.created_at);
+    return this;
+  }
+
+  static async join(params: JoinWaitlistParams): Promise<WaitlistResource> {
+    const json = (
+      await BaseResource._fetch<WaitlistJSON>({
+        path: '/waitlist',
+        method: 'POST',
+        body: params as any,
+      })
+    )?.response as unknown as WaitlistJSON;
+
+    return new Waitlist(json);
+  }
+}
diff --git a/packages/clerk-js/src/core/resources/__tests__/Waitlist.test.ts b/packages/clerk-js/src/core/resources/__tests__/Waitlist.test.ts
new file mode 100644
index 0000000000..d3c8ac5512
--- /dev/null
+++ b/packages/clerk-js/src/core/resources/__tests__/Waitlist.test.ts
@@ -0,0 +1,14 @@
+import { Waitlist } from '../internal';
+
+describe('Organization', () => {
+  it('has the same initial properties', () => {
+    const organization = new Waitlist({
+      object: 'waitlist',
+      id: 'test_id',
+      created_at: 12345,
+      updated_at: 5678,
+    });
+
+    expect(organization).toMatchSnapshot();
+  });
+});
diff --git a/packages/clerk-js/src/core/resources/__tests__/__snapshots__/Waitlist.test.ts.snap b/packages/clerk-js/src/core/resources/__tests__/__snapshots__/Waitlist.test.ts.snap
new file mode 100644
index 0000000000..85b3635146
--- /dev/null
+++ b/packages/clerk-js/src/core/resources/__tests__/__snapshots__/Waitlist.test.ts.snap
@@ -0,0 +1,10 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Organization has the same initial properties 1`] = `
+Waitlist {
+  "createdAt": 1970-01-01T00:00:12.345Z,
+  "id": "test_id",
+  "pathRoot": "/waitlist",
+  "updatedAt": 1970-01-01T00:00:05.678Z,
+}
+`;
diff --git a/packages/clerk-js/src/core/resources/index.ts b/packages/clerk-js/src/core/resources/index.ts
index f7d86f3f78..fea2110153 100644
--- a/packages/clerk-js/src/core/resources/index.ts
+++ b/packages/clerk-js/src/core/resources/index.ts
@@ -18,3 +18,4 @@ export * from './Token';
 export * from './User';
 export * from './Verification';
 export * from './Web3Wallet';
+export * from './Waitlist';
diff --git a/packages/clerk-js/src/core/resources/internal.ts b/packages/clerk-js/src/core/resources/internal.ts
index ef992f16ce..9777cf01dd 100644
--- a/packages/clerk-js/src/core/resources/internal.ts
+++ b/packages/clerk-js/src/core/resources/internal.ts
@@ -32,3 +32,4 @@ export * from './User';
 export * from './UserOrganizationInvitation';
 export * from './Verification';
 export * from './Web3Wallet';
+export * from './Waitlist';
diff --git a/packages/clerk-js/src/ui/Components.tsx b/packages/clerk-js/src/ui/Components.tsx
index 5fd0168ee3..cf186260ec 100644
--- a/packages/clerk-js/src/ui/Components.tsx
+++ b/packages/clerk-js/src/ui/Components.tsx
@@ -12,6 +12,7 @@ import type {
   SignInProps,
   SignUpProps,
   UserProfileProps,
+  WaitlistProps,
 } from '@clerk/types';
 import React, { Suspense } from 'react';
 
@@ -30,6 +31,7 @@ import {
   SignUpModal,
   UserProfileModal,
   UserVerificationModal,
+  WaitlistModal,
 } from './lazyModules/components';
 import {
   LazyComponentRenderer,
@@ -65,7 +67,8 @@ export type ComponentControls = {
       | 'userProfile'
       | 'organizationProfile'
       | 'createOrganization'
-      | 'userVerification',
+      | 'userVerification'
+      | 'waitlist',
   >(
     modal: T,
     props: T extends 'signIn'
@@ -74,7 +77,9 @@ export type ComponentControls = {
         ? SignUpProps
         : T extends 'userVerification'
           ? __experimental_UserVerificationProps
-          : UserProfileProps,
+          : T extends 'waitlist'
+            ? WaitlistProps
+            : UserProfileProps,
   ) => void;
   closeModal: (
     modal:
@@ -84,7 +89,8 @@ export type ComponentControls = {
       | 'userProfile'
       | 'organizationProfile'
       | 'createOrganization'
-      | 'userVerification',
+      | 'userVerification'
+      | 'waitlist',
     options?: {
       notify?: boolean;
     },
@@ -119,6 +125,7 @@ interface ComponentsState {
   organizationProfileModal: null | OrganizationProfileProps;
   createOrganizationModal: null | CreateOrganizationProps;
   organizationSwitcherPrefetch: boolean;
+  waitlistModal: null | WaitlistProps;
   nodes: Map<HTMLDivElement, HtmlNodeOptions>;
   impersonationFab: boolean;
 }
@@ -183,6 +190,7 @@ const componentNodes = Object.freeze({
   UserProfile: 'userProfileModal',
   OrganizationProfile: 'organizationProfileModal',
   CreateOrganization: 'createOrganizationModal',
+  Waitlist: 'waitlistModal',
 }) as any;
 
 const Components = (props: ComponentsProps) => {
@@ -197,6 +205,7 @@ const Components = (props: ComponentsProps) => {
     organizationProfileModal: null,
     createOrganizationModal: null,
     organizationSwitcherPrefetch: false,
+    waitlistModal: null,
     nodes: new Map(),
     impersonationFab: false,
   });
@@ -209,6 +218,7 @@ const Components = (props: ComponentsProps) => {
     userVerificationModal,
     organizationProfileModal,
     createOrganizationModal,
+    waitlistModal,
     nodes,
   } = state;
 
@@ -334,6 +344,7 @@ const Components = (props: ComponentsProps) => {
     >
       <SignInModal {...signInModal} />
       <SignUpModal {...signInModal} />
+      <WaitlistModal {...waitlistModal} />
     </LazyModalRenderer>
   );
 
@@ -350,6 +361,7 @@ const Components = (props: ComponentsProps) => {
     >
       <SignInModal {...signUpModal} />
       <SignUpModal {...signUpModal} />
+      <WaitlistModal {...waitlistModal} />
     </LazyModalRenderer>
   );
 
@@ -427,6 +439,22 @@ const Components = (props: ComponentsProps) => {
     </LazyModalRenderer>
   );
 
+  const mountedWaitlistModal = (
+    <LazyModalRenderer
+      globalAppearance={state.appearance}
+      appearanceKey={'waitlist'}
+      componentAppearance={waitlistModal?.appearance}
+      flowName={'waitlist'}
+      onClose={() => componentsControls.closeModal('waitlist')}
+      onExternalNavigate={() => componentsControls.closeModal('waitlist')}
+      startPath={buildVirtualRouterUrl({ base: '/waitlist', path: urlStateParam?.path })}
+      componentName={'WaitlistModal'}
+    >
+      <WaitlistModal {...waitlistModal} />
+      <SignInModal {...waitlistModal} />
+    </LazyModalRenderer>
+  );
+
   return (
     <Suspense fallback={''}>
       <LazyProviders
@@ -455,6 +483,7 @@ const Components = (props: ComponentsProps) => {
         {userVerificationModal && mountedUserVerificationModal}
         {organizationProfileModal && mountedOrganizationProfileModal}
         {createOrganizationModal && mountedCreateOrganizationModal}
+        {waitlistModal && mountedWaitlistModal}
         {state.impersonationFab && (
           <LazyImpersonationFabProvider globalAppearance={state.appearance}>
             <ImpersonationFab />
diff --git a/packages/clerk-js/src/ui/components/SignIn/SignIn.tsx b/packages/clerk-js/src/ui/components/SignIn/SignIn.tsx
index 0f4287db47..91b236f601 100644
--- a/packages/clerk-js/src/ui/components/SignIn/SignIn.tsx
+++ b/packages/clerk-js/src/ui/components/SignIn/SignIn.tsx
@@ -80,6 +80,7 @@ export const SignIn: React.ComponentType<SignInProps> = withCoreSessionSwitchGua
 export const SignInModal = (props: SignInModalProps): JSX.Element => {
   const signInProps = {
     signUpUrl: `/${VIRTUAL_ROUTER_BASE_PATH}/sign-up`,
+    waitlistUrl: `/${VIRTUAL_ROUTER_BASE_PATH}/waitlist`,
     ...props,
   };
 
diff --git a/packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx b/packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx
index 97651aaf66..31ae4fc780 100644
--- a/packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx
+++ b/packages/clerk-js/src/ui/components/SignIn/SignInStart.tsx
@@ -65,7 +65,7 @@ export function _SignInStart(): JSX.Element {
   const signIn = useCoreSignIn();
   const { navigate } = useRouter();
   const ctx = useSignInContext();
-  const { navigateAfterSignIn, signUpUrl } = ctx;
+  const { navigateAfterSignIn, signUpUrl, waitlistUrl } = ctx;
   const supportEmail = useSupportEmail();
   const identifierAttributes = useMemo<SignInStartIdentifier[]>(
     () => groupIdentifiers(userSettings.enabledFirstFactorIdentifiers),
@@ -420,6 +420,15 @@ export function _SignInStart(): JSX.Element {
               />
             </Card.Action>
           )}
+          {userSettings.signUp.mode === SIGN_UP_MODES.WAITLIST && (
+            <Card.Action elementId='signIn'>
+              <Card.ActionText localizationKey={localizationKeys('signIn.start.actionText__join_waitlist')} />
+              <Card.ActionLink
+                localizationKey={localizationKeys('signIn.start.actionLink__join_waitlist')}
+                to={clerk.buildUrlWithAuth(waitlistUrl)}
+              />
+            </Card.Action>
+          )}
         </Card.Footer>
       </Card.Root>
     </Flow.Part>
diff --git a/packages/clerk-js/src/ui/components/SignIn/__tests__/SignInStart.test.tsx b/packages/clerk-js/src/ui/components/SignIn/__tests__/SignInStart.test.tsx
index b88ad62ae3..a85f1f3be6 100644
--- a/packages/clerk-js/src/ui/components/SignIn/__tests__/SignInStart.test.tsx
+++ b/packages/clerk-js/src/ui/components/SignIn/__tests__/SignInStart.test.tsx
@@ -134,6 +134,17 @@ describe('SignInStart', () => {
     });
   });
 
+  describe('Waitlist mode', () => {
+    it('shows the waitlist message', async () => {
+      const { wrapper } = await createFixtures(f => {
+        f.withEmailAddress();
+        f.withWaitlistMode();
+      });
+      render(<SignInStart />, { wrapper });
+      screen.getByText('Join waitlist');
+    });
+  });
+
   describe('Social OAuth', () => {
     it.each(OAUTH_PROVIDERS)('shows the "Continue with $name" social OAuth button', async ({ provider, name }) => {
       const { wrapper } = await createFixtures(f => {
diff --git a/packages/clerk-js/src/ui/components/SignUp/SignUp.tsx b/packages/clerk-js/src/ui/components/SignUp/SignUp.tsx
index 12cbbb0f2d..0ae292691c 100644
--- a/packages/clerk-js/src/ui/components/SignUp/SignUp.tsx
+++ b/packages/clerk-js/src/ui/components/SignUp/SignUp.tsx
@@ -92,6 +92,7 @@ export const SignUp: React.ComponentType<SignUpProps> = withCoreSessionSwitchGua
 export const SignUpModal = (props: SignUpModalProps): JSX.Element => {
   const signUpProps = {
     signInUrl: `/${VIRTUAL_ROUTER_BASE_PATH}/sign-in`,
+    waitlistUrl: `/${VIRTUAL_ROUTER_BASE_PATH}/waitlist`,
     ...props,
   };
 
diff --git a/packages/clerk-js/src/ui/components/SignUp/SignUpRestrictedAccess.tsx b/packages/clerk-js/src/ui/components/SignUp/SignUpRestrictedAccess.tsx
index 2a931b5ce1..927e111951 100644
--- a/packages/clerk-js/src/ui/components/SignUp/SignUpRestrictedAccess.tsx
+++ b/packages/clerk-js/src/ui/components/SignUp/SignUpRestrictedAccess.tsx
@@ -1,22 +1,35 @@
 import { useClerk } from '@clerk/shared/react';
 
-import { useSignUpContext } from '../../contexts';
+import { SIGN_UP_MODES } from '../../../core/constants';
+import { useEnvironment, useSignUpContext } from '../../contexts';
 import { Button, Flex, Icon, localizationKeys } from '../../customizables';
 import { Card, Header } from '../../elements';
 import { useCardState } from '../../elements/contexts';
 import { useSupportEmail } from '../../hooks/useSupportEmail';
 import { Block } from '../../icons';
-
+import { useRouter } from '../../router';
 export const SignUpRestrictedAccess = () => {
   const clerk = useClerk();
   const card = useCardState();
-  const { signInUrl } = useSignUpContext();
+  const { navigate } = useRouter();
+  const { signInUrl, waitlistUrl } = useSignUpContext();
   const supportEmail = useSupportEmail();
+  const { userSettings } = useEnvironment();
+  const { mode } = userSettings.signUp;
 
   const handleEmailSupport = () => {
     window.location.href = `mailto:${supportEmail}`;
   };
 
+  const handleWaitlistNavigate = async () => {
+    await navigate(clerk.buildUrlWithAuth(waitlistUrl));
+  };
+
+  const subtitle =
+    mode === SIGN_UP_MODES.RESTRICTED
+      ? localizationKeys('signUp.restrictedAccess.subtitle')
+      : localizationKeys('signUp.restrictedAccess.subtitleWaitlist');
+
   return (
     <Card.Root>
       <Card.Content>
@@ -30,10 +43,10 @@ export const SignUpRestrictedAccess = () => {
             })}
           />
           <Header.Title localizationKey={localizationKeys('signUp.restrictedAccess.title')} />
-          <Header.Subtitle localizationKey={localizationKeys('signUp.restrictedAccess.subtitle')} />
+          <Header.Subtitle localizationKey={subtitle} />
         </Header.Root>
         <Card.Alert>{card.error}</Card.Alert>
-        {supportEmail && (
+        {mode === SIGN_UP_MODES.RESTRICTED && supportEmail && (
           <Flex
             direction='col'
             gap={4}
@@ -41,7 +54,17 @@ export const SignUpRestrictedAccess = () => {
             <Button
               localizationKey={localizationKeys('signUp.restrictedAccess.blockButton__emailSupport')}
               onClick={handleEmailSupport}
-              hasArrow
+            />
+          </Flex>
+        )}
+        {mode === SIGN_UP_MODES.WAITLIST && (
+          <Flex
+            direction='col'
+            gap={4}
+          >
+            <Button
+              localizationKey={localizationKeys('signUp.restrictedAccess.blockButton__joinWaitlist')}
+              onClick={handleWaitlistNavigate}
             />
           </Flex>
         )}
diff --git a/packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx b/packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx
index 1d748d56c7..3e1f4f8155 100644
--- a/packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx
+++ b/packages/clerk-js/src/ui/components/SignUp/SignUpStart.tsx
@@ -256,7 +256,7 @@ function _SignUpStart(): JSX.Element {
     (!hasTicket || missingRequirementsWithTicket) && userSettings.authenticatableSocialStrategies.length > 0;
   const showWeb3Providers = !hasTicket && userSettings.web3FirstFactors.length > 0;
 
-  if (mode === SIGN_UP_MODES.RESTRICTED && !hasTicket) {
+  if (mode !== SIGN_UP_MODES.PUBLIC && !hasTicket) {
     return <SignUpRestrictedAccess />;
   }
 
diff --git a/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpStart.test.tsx b/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpStart.test.tsx
index a79adcde68..4b6fa9b5ec 100644
--- a/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpStart.test.tsx
+++ b/packages/clerk-js/src/ui/components/SignUp/__tests__/SignUpStart.test.tsx
@@ -250,9 +250,20 @@ describe('SignUpStart', () => {
       const { wrapper } = await createFixtures(f => {
         f.withRestrictedMode();
       });
+      render(<SignUpStart />, { wrapper });
+      screen.getByText('Access restricted');
+    });
+  });
+
+  describe('Waitlist signup', () => {
+    it('shows the restricted component with waitlist mode', async () => {
+      const { wrapper } = await createFixtures(f => {
+        f.withWaitlistMode();
+      });
 
       render(<SignUpStart />, { wrapper });
       screen.getByText('Access restricted');
+      screen.getByText('Join waitlist');
     });
   });
 
diff --git a/packages/clerk-js/src/ui/components/Waitlist/Waitlist.tsx b/packages/clerk-js/src/ui/components/Waitlist/Waitlist.tsx
new file mode 100644
index 0000000000..b88a8f7e5d
--- /dev/null
+++ b/packages/clerk-js/src/ui/components/Waitlist/Waitlist.tsx
@@ -0,0 +1,62 @@
+import { useClerk } from '@clerk/shared/react';
+import type { WaitlistModalProps } from '@clerk/types';
+
+import { ComponentContext, useWaitlistContext } from '../../contexts';
+import { Flow, localizationKeys } from '../../customizables';
+import { Card, withCardStateProvider } from '../../elements';
+import { Route, VIRTUAL_ROUTER_BASE_PATH } from '../../router';
+import { useFormControl } from '../../utils';
+import { WaitlistForm } from './WaitlistForm';
+
+const _Waitlist = () => {
+  const clerk = useClerk();
+  const ctx = useWaitlistContext();
+  const { signInUrl } = ctx;
+
+  const formState = {
+    emailAddress: useFormControl('emailAddress', '', {
+      type: 'email',
+      label: localizationKeys('formFieldLabel__emailAddress'),
+      placeholder: localizationKeys('formFieldInputPlaceholder__emailAddress'),
+    }),
+  };
+
+  return (
+    <Flow.Root flow='waitlist'>
+      <Card.Root>
+        <Card.Content>
+          <WaitlistForm formState={formState} />
+        </Card.Content>
+        <Card.Footer>
+          <Card.Action elementId='waitlist'>
+            <Card.ActionText localizationKey={localizationKeys('waitlist.start.actionText')} />
+            <Card.ActionLink
+              localizationKey={localizationKeys('waitlist.start.actionLink')}
+              to={clerk.buildUrlWithAuth(signInUrl)}
+            />
+          </Card.Action>
+        </Card.Footer>
+      </Card.Root>
+    </Flow.Root>
+  );
+};
+
+export const Waitlist = withCardStateProvider(_Waitlist);
+
+export const WaitlistModal = (props: WaitlistModalProps): JSX.Element => {
+  const waitlistProps = {
+    signInUrl: `/${VIRTUAL_ROUTER_BASE_PATH}/sign-in`,
+    ...props,
+    routing: 'virtual',
+  };
+
+  return (
+    <Route path='waitlist'>
+      <ComponentContext.Provider value={{ ...waitlistProps, componentName: 'Waitlist', mode: 'modal' }}>
+        <div>
+          <Waitlist />
+        </div>
+      </ComponentContext.Provider>
+    </Route>
+  );
+};
diff --git a/packages/clerk-js/src/ui/components/Waitlist/WaitlistForm.tsx b/packages/clerk-js/src/ui/components/Waitlist/WaitlistForm.tsx
new file mode 100644
index 0000000000..b5a28c7eaf
--- /dev/null
+++ b/packages/clerk-js/src/ui/components/Waitlist/WaitlistForm.tsx
@@ -0,0 +1,125 @@
+import { useClerk } from '@clerk/shared/react';
+import type { JoinWaitlistParams } from '@clerk/types';
+
+import { useWizard, Wizard } from '../../common';
+import { useWaitlistContext } from '../../contexts';
+import { Col, descriptors, Flex, Icon, localizationKeys, Text } from '../../customizables';
+import { Card, Form, Header, useCardState } from '../../elements';
+import { useLoadingStatus } from '../../hooks';
+import { SpinnerJumbo } from '../../icons';
+import { useRouter } from '../../router';
+import { animations } from '../../styledSystem';
+import { type FormControlState, handleError } from '../../utils';
+import type { Fields } from './waitlistFormHelpers';
+
+type WaitlistFormProps = {
+  formState: Record<keyof Fields, FormControlState<any>>;
+};
+
+export const WaitlistForm = (props: WaitlistFormProps) => {
+  const clerk = useClerk();
+  const card = useCardState();
+  const status = useLoadingStatus();
+  const { navigate } = useRouter();
+  const ctx = useWaitlistContext();
+  const { formState } = props;
+  const wizard = useWizard({ onNextStep: () => card.setError(undefined) });
+
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+
+    status.setLoading();
+    card.setLoading();
+    card.setError(undefined);
+
+    const joinWaitlistParams: JoinWaitlistParams = { emailAddress: formState.emailAddress.value };
+
+    await clerk
+      .joinWaitlist(joinWaitlistParams)
+      .then(() => {
+        wizard.nextStep();
+
+        setTimeout(() => {
+          if (ctx.redirectUrl) {
+            void navigate(ctx.redirectUrl);
+          }
+        }, 2000);
+        return;
+      })
+      .catch(error => {
+        handleError(error, [], card.setError);
+      })
+      .finally(() => {
+        status.setIdle();
+        card.setIdle();
+      });
+  };
+
+  return (
+    <Wizard {...wizard.props}>
+      <Col gap={6}>
+        <Header.Root>
+          <Header.Title localizationKey={localizationKeys('waitlist.start.title')} />
+          <Header.Subtitle localizationKey={localizationKeys('waitlist.start.subtitle')} />
+        </Header.Root>
+        <Card.Alert>{card.error}</Card.Alert>
+        <Flex
+          direction='col'
+          elementDescriptor={descriptors.main}
+          gap={6}
+        >
+          <Form.Root
+            onSubmit={handleSubmit}
+            gap={8}
+          >
+            <Col gap={6}>
+              <Form.ControlRow elementId='emailAddress'>
+                <Form.PlainInput
+                  {...formState.emailAddress.props}
+                  isRequired
+                />
+              </Form.ControlRow>
+            </Col>
+            <Col center>
+              <Form.SubmitButton localizationKey={localizationKeys('waitlist.start.formButton')} />
+            </Col>
+          </Form.Root>
+        </Flex>
+      </Col>
+      <Col gap={6}>
+        <Header.Root>
+          <Header.Title localizationKey={localizationKeys('waitlist.success.title')} />
+          <Header.Subtitle localizationKey={localizationKeys('waitlist.success.subtitle')} />
+        </Header.Root>
+        {ctx.redirectUrl && (
+          <Flex
+            direction='col'
+            elementDescriptor={descriptors.main}
+            gap={6}
+          >
+            <Col center>
+              <Flex
+                gap={2}
+                align='center'
+              >
+                <Icon
+                  icon={SpinnerJumbo}
+                  sx={t => ({
+                    margin: 'auto',
+                    width: t.sizes.$6,
+                    height: t.sizes.$6,
+                    animation: `${animations.spinning} 1s linear infinite`,
+                  })}
+                />
+                <Text
+                  colorScheme='secondary'
+                  localizationKey={localizationKeys('waitlist.success.message')}
+                />
+              </Flex>
+            </Col>
+          </Flex>
+        )}
+      </Col>
+    </Wizard>
+  );
+};
diff --git a/packages/clerk-js/src/ui/components/Waitlist/__tests__/Waitlist.test.tsx b/packages/clerk-js/src/ui/components/Waitlist/__tests__/Waitlist.test.tsx
new file mode 100644
index 0000000000..4119c185a4
--- /dev/null
+++ b/packages/clerk-js/src/ui/components/Waitlist/__tests__/Waitlist.test.tsx
@@ -0,0 +1,46 @@
+import type { WaitlistResource } from '@clerk/types';
+
+import { render, screen } from '../../../../testUtils';
+import { bindCreateFixtures } from '../../../utils/test/createFixtures';
+import { Waitlist } from '../Waitlist';
+
+const { createFixtures } = bindCreateFixtures('Waitlist');
+
+describe('Waitlist', () => {
+  it('should render the waitlist', async () => {
+    const { wrapper } = await createFixtures(f => {
+      f.withWaitlistMode();
+    });
+    render(<Waitlist />, { wrapper });
+
+    screen.getByText('Enter your email address and we’ll let you know when your spot is ready');
+    screen.getByRole('button', { name: 'Join the waitlist' });
+  });
+
+  it('should go to success step', async () => {
+    const { wrapper, fixtures } = await createFixtures(f => {
+      f.withWaitlistMode();
+    });
+    fixtures.clerk.joinWaitlist.mockResolvedValueOnce({ id: 'wle_2lEkeknQndRH0q3ImmFdJI4PbXh' } as WaitlistResource);
+    const { userEvent } = render(<Waitlist />, { wrapper });
+    await userEvent.type(screen.getByLabelText(/email address/i), 'hello@clerk.com');
+    await userEvent.click(screen.getByRole('button', { name: 'Join the waitlist' }));
+
+    expect(fixtures.clerk.joinWaitlist).toHaveBeenCalled();
+
+    screen.getByText('Thanks for joining the waitlist!');
+  });
+
+  it('should have the correct sign-in url', async () => {
+    const { wrapper, fixtures } = await createFixtures(f => {
+      f.withWaitlistMode();
+    });
+    fixtures.clerk.joinWaitlist.mockResolvedValueOnce({ id: 'wle_2lEkeknQndRH0q3ImmFdJI4PbXh' } as WaitlistResource);
+    render(<Waitlist />, { wrapper });
+
+    const signInLink = screen.getByText(/Already has access/i).nextElementSibling;
+    expect(signInLink?.textContent).toBe('Sign in');
+    expect(signInLink?.tagName.toUpperCase()).toBe('A');
+    expect(signInLink?.getAttribute('href')).toMatch(fixtures.environment.displayConfig.signInUrl);
+  });
+});
diff --git a/packages/clerk-js/src/ui/components/Waitlist/index.ts b/packages/clerk-js/src/ui/components/Waitlist/index.ts
new file mode 100644
index 0000000000..677826a4b1
--- /dev/null
+++ b/packages/clerk-js/src/ui/components/Waitlist/index.ts
@@ -0,0 +1 @@
+export * from './Waitlist';
diff --git a/packages/clerk-js/src/ui/components/Waitlist/waitlistFormHelpers.ts b/packages/clerk-js/src/ui/components/Waitlist/waitlistFormHelpers.ts
new file mode 100644
index 0000000000..4ac0f1ca90
--- /dev/null
+++ b/packages/clerk-js/src/ui/components/Waitlist/waitlistFormHelpers.ts
@@ -0,0 +1,11 @@
+const FieldKeys = ['emailAddress'];
+
+export type FieldKey = (typeof FieldKeys)[number];
+
+export type Field = {
+  required: boolean;
+};
+
+export type Fields = {
+  [key in FieldKey]: Field | undefined;
+};
diff --git a/packages/clerk-js/src/ui/contexts/ClerkUIComponentsContext.tsx b/packages/clerk-js/src/ui/contexts/ClerkUIComponentsContext.tsx
index c9e0434b43..79e8eb097f 100644
--- a/packages/clerk-js/src/ui/contexts/ClerkUIComponentsContext.tsx
+++ b/packages/clerk-js/src/ui/contexts/ClerkUIComponentsContext.tsx
@@ -24,6 +24,7 @@ import type {
   UserButtonCtx,
   UserProfileCtx,
   UserVerificationCtx,
+  WaitlistCtx,
 } from '../types';
 import type { CustomPageContent } from '../utils';
 import {
@@ -57,6 +58,7 @@ export type SignUpContextType = SignUpCtx & {
   authQueryString: string | null;
   afterSignUpUrl: string;
   afterSignInUrl: string;
+  waitlistUrl: string;
 };
 
 export const useSignUpContext = (): SignUpContextType => {
@@ -96,10 +98,12 @@ export const useSignUpContext = (): SignUpContextType => {
   // from the `path` prop instead, when the routing is set to 'path'.
   let signUpUrl = (ctx.routing === 'path' && ctx.path) || options.signUpUrl || displayConfig.signUpUrl;
   let signInUrl = ctx.signInUrl || options.signInUrl || displayConfig.signInUrl;
+  let waitlistUrl = ctx.waitlistUrl || options.waitlistUrl || displayConfig.waitlistUrl;
 
   const preservedParams = redirectUrls.getPreservedSearchParams();
   signInUrl = buildURL({ base: signInUrl, hashSearchParams: [queryParams, preservedParams] }, { stringify: true });
   signUpUrl = buildURL({ base: signUpUrl, hashSearchParams: [queryParams, preservedParams] }, { stringify: true });
+  waitlistUrl = buildURL({ base: waitlistUrl, hashSearchParams: [queryParams, preservedParams] }, { stringify: true });
 
   // TODO: Avoid building this url again to remove duplicate code. Get it from window.Clerk instead.
   const secondFactorUrl = buildURL({ base: signInUrl, hashPath: '/factor-two' }, { stringify: true });
@@ -109,6 +113,7 @@ export const useSignUpContext = (): SignUpContextType => {
     componentName,
     signInUrl,
     signUpUrl,
+    waitlistUrl,
     secondFactorUrl,
     afterSignUpUrl,
     afterSignInUrl,
@@ -129,6 +134,7 @@ export type SignInContextType = SignInCtx & {
   afterSignUpUrl: string;
   afterSignInUrl: string;
   transferable: boolean;
+  waitlistUrl: string;
 };
 
 export const useSignInContext = (): SignInContextType => {
@@ -168,10 +174,12 @@ export const useSignInContext = (): SignInContextType => {
   // from the `path` prop instead, when the routing is set to 'path'.
   let signInUrl = (ctx.routing === 'path' && ctx.path) || options.signInUrl || displayConfig.signInUrl;
   let signUpUrl = ctx.signUpUrl || options.signUpUrl || displayConfig.signUpUrl;
+  let waitlistUrl = ctx.waitlistUrl || options.waitlistUrl || displayConfig.waitlistUrl;
 
   const preservedParams = redirectUrls.getPreservedSearchParams();
   signInUrl = buildURL({ base: signInUrl, hashSearchParams: [queryParams, preservedParams] }, { stringify: true });
   signUpUrl = buildURL({ base: signUpUrl, hashSearchParams: [queryParams, preservedParams] }, { stringify: true });
+  waitlistUrl = buildURL({ base: waitlistUrl, hashSearchParams: [queryParams, preservedParams] }, { stringify: true });
 
   const signUpContinueUrl = buildURL({ base: signUpUrl, hashPath: '/continue' }, { stringify: true });
 
@@ -181,6 +189,7 @@ export const useSignInContext = (): SignInContextType => {
     componentName,
     signUpUrl,
     signInUrl,
+    waitlistUrl,
     afterSignInUrl,
     afterSignUpUrl,
     navigateAfterSignIn,
@@ -624,3 +633,23 @@ export const useGoogleOneTapContext = () => {
     generateCallbackUrls,
   };
 };
+
+export type WaitlistContextType = WaitlistCtx & {
+  signInUrl: string;
+  redirectUrl?: string;
+};
+
+export const useWaitlistContext = (): WaitlistContextType => {
+  const { componentName, ...ctx } = (React.useContext(ComponentContext) || {}) as WaitlistCtx;
+  const { displayConfig } = useEnvironment();
+  const options = useOptions();
+
+  let signInUrl = ctx.signInUrl || options.signInUrl || displayConfig.signInUrl;
+  signInUrl = buildURL({ base: signInUrl }, { stringify: true });
+
+  return {
+    ...ctx,
+    componentName,
+    signInUrl,
+  };
+};
diff --git a/packages/clerk-js/src/ui/elements/contexts/FlowMetadataContext.tsx b/packages/clerk-js/src/ui/elements/contexts/FlowMetadataContext.tsx
index 3969b10655..65b37e30f1 100644
--- a/packages/clerk-js/src/ui/elements/contexts/FlowMetadataContext.tsx
+++ b/packages/clerk-js/src/ui/elements/contexts/FlowMetadataContext.tsx
@@ -12,7 +12,8 @@ type FlowMetadata = {
     | 'createOrganization'
     | 'organizationSwitcher'
     | 'organizationList'
-    | 'oneTap';
+    | 'oneTap'
+    | 'waitlist';
   part?:
     | 'start'
     | 'emailCode'
diff --git a/packages/clerk-js/src/ui/icons/index.ts b/packages/clerk-js/src/ui/icons/index.ts
index 7a43c73f84..861f4795e6 100644
--- a/packages/clerk-js/src/ui/icons/index.ts
+++ b/packages/clerk-js/src/ui/icons/index.ts
@@ -62,3 +62,4 @@ export { default as Organization } from './organization.svg';
 export { default as Users } from './users.svg';
 export { default as Fingerprint } from './fingerprint.svg';
 export { default as Block } from './block.svg';
+export { default as SpinnerJumbo } from './spinner-jumbo.svg';
diff --git a/packages/clerk-js/src/ui/icons/spinner-jumbo.svg b/packages/clerk-js/src/ui/icons/spinner-jumbo.svg
new file mode 100644
index 0000000000..bd1d69c9c0
--- /dev/null
+++ b/packages/clerk-js/src/ui/icons/spinner-jumbo.svg
@@ -0,0 +1,11 @@
+<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.25 11.66L12.2499 11.66" stroke="#747686" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M8.5 13.25L8.5 13.2499" stroke="#747686" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M3.25 8L3.2501 8" stroke="#747686" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M4.75 4.32996L4.75007 4.33003" stroke="#747686" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M4.75 11.66L4.75007 11.6599" stroke="#747686" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M8.5 2.75V2.7501" stroke="#747686" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M13.75 8L13.7499 8" stroke="#747686" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M12.25 4.33002L12.2499 4.33009" stroke="#747686" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M13.75 8C13.75 5.10051 11.3995 2.75 8.5 2.75" stroke="#747686" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/packages/clerk-js/src/ui/lazyModules/components.ts b/packages/clerk-js/src/ui/lazyModules/components.ts
index fa5c1fd54e..44ad640c53 100644
--- a/packages/clerk-js/src/ui/lazyModules/components.ts
+++ b/packages/clerk-js/src/ui/lazyModules/components.ts
@@ -14,6 +14,7 @@ const componentImportPaths = {
   ImpersonationFab: () => import(/* webpackChunkName: "impersonationfab" */ './../components/ImpersonationFab'),
   GoogleOneTap: () => import(/* webpackChunkName: "onetap" */ './../components/GoogleOneTap'),
   UserVerification: () => import(/* webpackChunkName: "userverification" */ './../components/UserVerification'),
+  Waitlist: () => import(/* webpackChunkName: "waitlist" */ './../components/Waitlist'),
 } as const;
 
 export const SignIn = lazy(() => componentImportPaths.SignIn().then(module => ({ default: module.SignIn })));
@@ -68,6 +69,12 @@ export const OrganizationList = lazy(() =>
   componentImportPaths.OrganizationList().then(module => ({ default: module.OrganizationList })),
 );
 
+export const Waitlist = lazy(() => componentImportPaths.Waitlist().then(module => ({ default: module.Waitlist })));
+
+export const WaitlistModal = lazy(() =>
+  componentImportPaths.Waitlist().then(module => ({ default: module.WaitlistModal })),
+);
+
 export const ImpersonationFab = lazy(() =>
   componentImportPaths.ImpersonationFab().then(module => ({ default: module.ImpersonationFab })),
 );
@@ -93,6 +100,8 @@ export const ClerkComponents = {
   CreateOrganizationModal,
   UserVerificationModal,
   GoogleOneTap,
+  Waitlist,
+  WaitlistModal,
 };
 
 export type ClerkComponentName = keyof typeof ClerkComponents;
diff --git a/packages/clerk-js/src/ui/types.ts b/packages/clerk-js/src/ui/types.ts
index 3b6035ceeb..b8f3bdccaa 100644
--- a/packages/clerk-js/src/ui/types.ts
+++ b/packages/clerk-js/src/ui/types.ts
@@ -9,6 +9,7 @@ import type {
   SignUpProps,
   UserButtonProps,
   UserProfileProps,
+  WaitlistProps,
 } from '@clerk/types';
 
 export type {
@@ -21,6 +22,7 @@ export type {
   OrganizationProfileProps,
   CreateOrganizationProps,
   OrganizationListProps,
+  WaitlistProps,
   __experimental_UserVerificationProps,
 };
 
@@ -86,6 +88,11 @@ export type GoogleOneTapCtx = GoogleOneTapProps & {
   componentName: 'GoogleOneTap';
 };
 
+export type WaitlistCtx = WaitlistProps & {
+  componentName: 'Waitlist';
+  mode?: ComponentMode;
+};
+
 export type AvailableComponentCtx =
   | SignInCtx
   | SignUpCtx
@@ -96,4 +103,5 @@ export type AvailableComponentCtx =
   | CreateOrganizationCtx
   | OrganizationSwitcherCtx
   | OrganizationListCtx
-  | GoogleOneTapCtx;
+  | GoogleOneTapCtx
+  | WaitlistCtx;
diff --git a/packages/clerk-js/src/ui/utils/test/fixtureHelpers.ts b/packages/clerk-js/src/ui/utils/test/fixtureHelpers.ts
index 2a595481de..cfed51ac42 100644
--- a/packages/clerk-js/src/ui/utils/test/fixtureHelpers.ts
+++ b/packages/clerk-js/src/ui/utils/test/fixtureHelpers.ts
@@ -508,6 +508,10 @@ const createUserSettingsFixtureHelpers = (environment: EnvironmentJSON) => {
     us.sign_up.legal_consent_enabled = true;
   };
 
+  const withWaitlistMode = () => {
+    us.sign_up.mode = SIGN_UP_MODES.WAITLIST;
+  };
+
   // TODO: Add the rest, consult pkg/generate/auth_config.go
 
   return {
@@ -527,5 +531,6 @@ const createUserSettingsFixtureHelpers = (environment: EnvironmentJSON) => {
     withPasskeySettings,
     withRestrictedMode,
     withLegalConsent,
+    withWaitlistMode,
   };
 };
diff --git a/packages/clerk-js/src/ui/utils/test/fixtures.ts b/packages/clerk-js/src/ui/utils/test/fixtures.ts
index d7291bc825..5547cddd4c 100644
--- a/packages/clerk-js/src/ui/utils/test/fixtures.ts
+++ b/packages/clerk-js/src/ui/utils/test/fixtures.ts
@@ -189,6 +189,7 @@ const createBaseUserSettings = (): UserSettingsJSON => {
       progressive: true,
       captcha_enabled: false,
       disable_hibp: false,
+      mode: 'public',
     },
     restrictions: {
       allowlist: {
diff --git a/packages/localizations/src/en-US.ts b/packages/localizations/src/en-US.ts
index be3a0961b0..f1640b3f34 100644
--- a/packages/localizations/src/en-US.ts
+++ b/packages/localizations/src/en-US.ts
@@ -448,6 +448,8 @@ export const enUS: LocalizationResource = {
       actionText: 'Don’t have an account?',
       subtitle: 'Welcome back! Please sign in to continue',
       title: 'Sign in to {{applicationName}}',
+      actionText__join_waitlist: 'Want early access?',
+      actionLink__join_waitlist: 'Join waitlist',
     },
     totpMfa: {
       formTitle: 'Verification code',
@@ -511,9 +513,11 @@ export const enUS: LocalizationResource = {
     restrictedAccess: {
       title: 'Access restricted',
       subtitle: 'Sign ups are currently disabled. If you believe you should have access, please contact support.',
+      subtitleWaitlist: 'Sign ups are currently disabled. To be the first to know when we launch, join the waitlist.',
       actionLink: 'Sign in',
       actionText: 'Already have an account?',
       blockButton__emailSupport: 'Email support',
+      blockButton__joinWaitlist: 'Join waitlist',
     },
     __experimental_legalConsent: {
       continue: {
@@ -898,4 +902,18 @@ export const enUS: LocalizationResource = {
       web3WalletButtonsBlockButton: '{{provider|titleize}}',
     },
   },
+  waitlist: {
+    start: {
+      title: 'Join the waitlist',
+      subtitle: 'Enter your email address and we’ll let you know when your spot is ready',
+      formButton: 'Join the waitlist',
+      actionText: 'Already has access?',
+      actionLink: 'Sign in',
+    },
+    success: {
+      title: 'Thanks for joining the waitlist!',
+      subtitle: 'We’ll be in touch when your spot is ready',
+      message: 'You will be redirected soon...',
+    },
+  },
 } as const;
diff --git a/packages/nextjs/src/client-boundary/uiComponents.tsx b/packages/nextjs/src/client-boundary/uiComponents.tsx
index 50599e5df8..b641f62066 100644
--- a/packages/nextjs/src/client-boundary/uiComponents.tsx
+++ b/packages/nextjs/src/client-boundary/uiComponents.tsx
@@ -27,6 +27,7 @@ export {
   SignUpButton,
   UserButton,
   GoogleOneTap,
+  Waitlist,
 } from '@clerk/clerk-react';
 
 // The assignment of UserProfile with BaseUserProfile props is used
diff --git a/packages/nextjs/src/index.ts b/packages/nextjs/src/index.ts
index 8a7e7513fe..72a569bcf3 100644
--- a/packages/nextjs/src/index.ts
+++ b/packages/nextjs/src/index.ts
@@ -31,6 +31,7 @@ export {
   UserButton,
   UserProfile,
   GoogleOneTap,
+  Waitlist,
 } from './client-boundary/uiComponents';
 
 /**
diff --git a/packages/react/src/components/index.ts b/packages/react/src/components/index.ts
index 39b52fdda1..08569cfebd 100644
--- a/packages/react/src/components/index.ts
+++ b/packages/react/src/components/index.ts
@@ -8,6 +8,7 @@ export {
   CreateOrganization,
   OrganizationList,
   GoogleOneTap,
+  Waitlist,
 } from './uiComponents';
 
 export {
diff --git a/packages/react/src/components/uiComponents.tsx b/packages/react/src/components/uiComponents.tsx
index d4c589ced1..0a2586f172 100644
--- a/packages/react/src/components/uiComponents.tsx
+++ b/packages/react/src/components/uiComponents.tsx
@@ -10,6 +10,7 @@ import type {
   SignUpProps,
   UserButtonProps,
   UserProfileProps,
+  WaitlistProps,
   Without,
 } from '@clerk/types';
 import type { PropsWithChildren } from 'react';
@@ -474,3 +475,14 @@ export const GoogleOneTap = withClerk(({ clerk, ...props }: WithClerkProp<Google
     />
   );
 }, 'GoogleOneTap');
+
+export const Waitlist = withClerk(({ clerk, ...props }: WithClerkProp<WaitlistProps>) => {
+  return (
+    <Portal
+      mount={clerk.mountWaitlist}
+      unmount={clerk.unmountWaitlist}
+      updateProps={(clerk as any).__unstable__updateProps}
+      props={props}
+    />
+  );
+}, 'Waitlist');
diff --git a/packages/react/src/isomorphicClerk.ts b/packages/react/src/isomorphicClerk.ts
index 3a94a521f9..bfa9ea5afc 100644
--- a/packages/react/src/isomorphicClerk.ts
+++ b/packages/react/src/isomorphicClerk.ts
@@ -19,6 +19,7 @@ import type {
   HandleEmailLinkVerificationParams,
   HandleOAuthCallbackParams,
   InstanceType,
+  JoinWaitlistParams,
   ListenerCallback,
   LoadedClerk,
   OrganizationListProps,
@@ -41,6 +42,8 @@ import type {
   UserButtonProps,
   UserProfileProps,
   UserResource,
+  WaitlistProps,
+  WaitlistResource,
   Without,
 } from '@clerk/types';
 
@@ -91,6 +94,7 @@ type IsomorphicLoadedClerk = Without<
   | 'buildAfterSignOutUrl'
   | 'buildAfterMultiSessionSingleSignOutUrl'
   | 'buildUrlWithAuth'
+  | 'buildWaitlistUrl'
   | 'handleRedirectCallback'
   | 'handleGoogleOneTapCallback'
   | 'handleUnauthenticated'
@@ -100,6 +104,7 @@ type IsomorphicLoadedClerk = Without<
   | 'authenticateWithGoogleOneTap'
   | 'createOrganization'
   | 'getOrganization'
+  | 'joinWaitlist'
   | 'mountUserButton'
   | 'mountOrganizationList'
   | 'mountOrganizationSwitcher'
@@ -108,6 +113,7 @@ type IsomorphicLoadedClerk = Without<
   | 'mountSignUp'
   | 'mountSignIn'
   | 'mountUserProfile'
+  | 'mountWaitlist'
   | 'client'
 > & {
   // TODO: Align return type and parms
@@ -125,6 +131,8 @@ type IsomorphicLoadedClerk = Without<
   createOrganization: (params: CreateOrganizationParams) => Promise<OrganizationResource | void>;
   // TODO: Align return type (maybe not possible or correct)
   getOrganization: (organizationId: string) => Promise<OrganizationResource | void>;
+  // TODO: Align return type
+  joinWaitlist: (params: JoinWaitlistParams) => Promise<WaitlistResource | void>;
 
   // TODO: Align return type
   buildSignInUrl: (opts?: RedirectOptions) => string | void;
@@ -145,6 +153,8 @@ type IsomorphicLoadedClerk = Without<
   // TODO: Align return type
   buildAfterMultiSessionSingleSignOutUrl: () => string | void;
   // TODO: Align optional props
+  buildWaitlistUrl: () => string | void;
+  // TODO: Align optional props
   mountUserButton: (node: HTMLDivElement, props: UserButtonProps) => void;
   mountOrganizationList: (node: HTMLDivElement, props: OrganizationListProps) => void;
   mountOrganizationSwitcher: (node: HTMLDivElement, props: OrganizationSwitcherProps) => void;
@@ -153,6 +163,7 @@ type IsomorphicLoadedClerk = Without<
   mountSignUp: (node: HTMLDivElement, props: SignUpProps) => void;
   mountSignIn: (node: HTMLDivElement, props: SignInProps) => void;
   mountUserProfile: (node: HTMLDivElement, props: UserProfileProps) => void;
+  mountWaitlist: (node: HTMLDivElement, props: WaitlistProps) => void;
   client: ClientResource | undefined;
 };
 
@@ -168,6 +179,7 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
   private preopenUserProfile?: null | UserProfileProps = null;
   private preopenOrganizationProfile?: null | OrganizationProfileProps = null;
   private preopenCreateOrganization?: null | CreateOrganizationProps = null;
+  private preOpenWaitlist?: null | WaitlistProps = null;
   private premountSignInNodes = new Map<HTMLDivElement, SignInProps>();
   private premountSignUpNodes = new Map<HTMLDivElement, SignUpProps>();
   private premountUserProfileNodes = new Map<HTMLDivElement, UserProfileProps>();
@@ -177,6 +189,7 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
   private premountOrganizationSwitcherNodes = new Map<HTMLDivElement, OrganizationSwitcherProps>();
   private premountOrganizationListNodes = new Map<HTMLDivElement, OrganizationListProps>();
   private premountMethodCalls = new Map<MethodName<BrowserClerk>, MethodCallback>();
+  private premountWaitlistNodes = new Map<HTMLDivElement, WaitlistProps>();
   // A separate Map of `addListener` method calls to handle multiple listeners.
   private premountAddListenerCalls = new Map<
     ListenerCallback,
@@ -366,6 +379,15 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
     }
   };
 
+  buildWaitlistUrl = (): string | void => {
+    const callback = () => this.clerkjs?.buildWaitlistUrl() || '';
+    if (this.clerkjs && this.#loaded) {
+      return callback();
+    } else {
+      this.premountMethodCalls.set('buildWaitlistUrl', callback);
+    }
+  };
+
   buildUrlWithAuth = (to: string): string | void => {
     const callback = () => this.clerkjs?.buildUrlWithAuth(to) || '';
     if (this.clerkjs && this.#loaded) {
@@ -526,6 +548,10 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
       clerkjs.openCreateOrganization(this.preopenCreateOrganization);
     }
 
+    if (this.preOpenWaitlist !== null) {
+      clerkjs.openWaitlist(this.preOpenWaitlist);
+    }
+
     this.premountSignInNodes.forEach((props: SignInProps, node: HTMLDivElement) => {
       clerkjs.mountSignIn(node, props);
     });
@@ -546,6 +572,10 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
       clerkjs.mountOrganizationList(node, props);
     });
 
+    this.premountWaitlistNodes.forEach((props: WaitlistProps, node: HTMLDivElement) => {
+      clerkjs.mountWaitlist(node, props);
+    });
+
     this.#loaded = true;
     this.emitLoaded();
     return this.clerkjs;
@@ -729,6 +759,22 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
     }
   };
 
+  openWaitlist = (props?: WaitlistProps): void => {
+    if (this.clerkjs && this.#loaded) {
+      this.clerkjs.openWaitlist(props);
+    } else {
+      this.preOpenWaitlist = props;
+    }
+  };
+
+  closeWaitlist = (): void => {
+    if (this.clerkjs && this.#loaded) {
+      this.clerkjs.closeWaitlist();
+    } else {
+      this.preOpenWaitlist = null;
+    }
+  };
+
   openSignUp = (props?: SignUpProps): void => {
     if (this.clerkjs && this.#loaded) {
       this.clerkjs.openSignUp(props);
@@ -882,6 +928,20 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
     }
   };
 
+  mountWaitlist = (node: HTMLDivElement, props: WaitlistProps): void => {
+    if (this.clerkjs && this.#loaded) {
+      this.clerkjs.mountWaitlist(node, props);
+    } else {
+      this.premountWaitlistNodes.set(node, props);
+    }
+  };
+
+  unmountWaitlist = (node: HTMLDivElement): void => {
+    if (this.clerkjs && this.#loaded) {
+      this.clerkjs.unmountWaitlist(node);
+    }
+  };
+
   addListener = (listener: ListenerCallback): UnsubscribeCallback => {
     if (this.clerkjs) {
       return this.clerkjs.addListener(listener);
@@ -994,6 +1054,16 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
     }
   };
 
+  redirectToWaitlist = async (): Promise<unknown> => {
+    const callback = () => this.clerkjs?.redirectToWaitlist();
+    if (this.clerkjs && this.#loaded) {
+      return callback();
+    } else {
+      this.premountMethodCalls.set('redirectToWaitlist', callback);
+      return;
+    }
+  };
+
   handleRedirectCallback = (params: HandleOAuthCallbackParams): void => {
     const callback = () => this.clerkjs?.handleRedirectCallback(params);
     if (this.clerkjs && this.#loaded) {
@@ -1092,6 +1162,15 @@ export class IsomorphicClerk implements IsomorphicLoadedClerk {
     }
   };
 
+  joinWaitlist = async (params: JoinWaitlistParams): Promise<WaitlistResource | void> => {
+    const callback = () => this.clerkjs?.joinWaitlist(params);
+    if (this.clerkjs && this.#loaded) {
+      return callback() as Promise<WaitlistResource>;
+    } else {
+      this.premountMethodCalls.set('joinWaitlist', callback);
+    }
+  };
+
   signOut: SignOut = async (
     signOutCallbackOrOptions?: SignOutCallback | SignOutOptions,
     options?: SignOutOptions,
diff --git a/packages/types/src/appearance.ts b/packages/types/src/appearance.ts
index 88b566cb38..099f49bcc1 100644
--- a/packages/types/src/appearance.ts
+++ b/packages/types/src/appearance.ts
@@ -630,6 +630,7 @@ export type OrganizationListTheme = Theme;
 export type OrganizationProfileTheme = Theme;
 export type CreateOrganizationTheme = Theme;
 export type UserVerificationTheme = Theme;
+export type WaitlistTheme = Theme;
 
 export type Appearance<T = Theme> = T & {
   /**
@@ -672,4 +673,8 @@ export type Appearance<T = Theme> = T & {
    * Theme overrides that only apply to the `<CreateOrganization />` component
    */
   oneTap?: T;
+  /**
+   * Theme overrides that only apply to the `<Waitlist />` component
+   */
+  waitlist?: T;
 };
diff --git a/packages/types/src/clerk.ts b/packages/types/src/clerk.ts
index 8dbcb28205..c97e8a0427 100644
--- a/packages/types/src/clerk.ts
+++ b/packages/types/src/clerk.ts
@@ -11,6 +11,7 @@ import type {
   UserButtonTheme,
   UserProfileTheme,
   UserVerificationTheme,
+  WaitlistTheme,
 } from './appearance';
 import type { ClientResource } from './client';
 import type { CustomMenuItem } from './customMenuItems';
@@ -40,6 +41,7 @@ import type { SignUpResource } from './signUp';
 import type { Web3Strategy } from './strategies';
 import type { UserResource } from './user';
 import type { Autocomplete, DeepPartial, DeepSnakeToCamel } from './utils';
+import type { WaitlistResource } from './waitlist';
 
 /**
  * Contains information about the SDK that the host application is using.
@@ -228,6 +230,17 @@ export interface Clerk {
    */
   closeCreateOrganization: () => void;
 
+  /**
+   * Opens the Clerk Waitlist modal.
+   * @param props Optional props that will be passed to the Waitlist component.
+   */
+  openWaitlist: (props?: WaitlistProps) => void;
+
+  /**
+   * Closes the Clerk Waitlist modal.
+   */
+  closeWaitlist: () => void;
+
   /**
    * Mounts a sign in flow component at the target element.
    * @param targetNode Target node to mount the SignIn component.
@@ -351,6 +364,19 @@ export interface Clerk {
    */
   unmountOrganizationList: (targetNode: HTMLDivElement) => void;
 
+  /**
+   * Mount a waitlist at the target element.
+   * @param targetNode Target to mount the Waitlist component.
+   * @param props Configuration parameters.
+   */
+  mountWaitlist: (targetNode: HTMLDivElement, props?: WaitlistProps) => void;
+
+  /**
+   * Unmount the Waitlist component from the target node.
+   * @param targetNode Target node to unmount the Waitlist component from.
+   */
+  unmountWaitlist: (targetNode: HTMLDivElement) => void;
+
   /**
    * Register a listener that triggers a callback each time important Clerk resources are changed.
    * Allows to hook up at different steps in the sign up, sign in processes.
@@ -434,6 +460,11 @@ export interface Clerk {
    */
   buildAfterMultiSessionSingleSignOutUrl(): string;
 
+  /**
+   * Returns the configured url where <Waitlist/> is mounted or a custom waitlist page is rendered.
+   */
+  buildWaitlistUrl(): string;
+
   /**
    *
    * Redirects to the provided url after decorating it with the auth token for development instances.
@@ -486,6 +517,11 @@ export interface Clerk {
    */
   redirectToAfterSignOut: () => void;
 
+  /**
+   * Redirects to the configured URL where <Waitlist/> is mounted.
+   */
+  redirectToWaitlist: () => void;
+
   /**
    * Completes a Google One Tap redirection flow started by
    * {@link Clerk.authenticateWithGoogleOneTap}
@@ -549,6 +585,8 @@ export interface Clerk {
    * Handles a 401 response from Frontend API by refreshing the client and session object accordingly
    */
   handleUnauthenticated: () => Promise<unknown>;
+
+  joinWaitlist: (params: JoinWaitlistParams) => Promise<WaitlistResource>;
 }
 
 export type HandleOAuthCallbackParams = TransferableOption &
@@ -692,7 +730,8 @@ export type ClerkOptions = ClerkOptionsNavigation &
      * Contains information about the SDK that the host application is using. You don't need to set this value yourself unless you're [developing an SDK](https://clerk.com/docs/references/sdk/overview).
      */
     sdkMetadata?: SDKMetadata;
-
+    /** This URL will be used for any redirects that might happen and needs to point to your primary application on the client-side. This option is optional for production instances and required for development instances. */
+    waitlistUrl?: string;
     /**
      * Enable experimental flags to gain access to new features. These flags are not guaranteed to be stable and may change drastically in between patch or minor versions.
      */
@@ -846,6 +885,11 @@ export type SignInProps = RoutingOptions & {
    * Enable experimental flags to gain access to new features. These flags are not guaranteed to be stable and may change drastically in between patch or minor versions.
    */
   __experimental?: Record<string, any> & { newComponents?: boolean };
+  /**
+   * Full URL or path to for the waitlist process.
+   * Used to fill the "Join waitlist" link in the SignUp component.
+   */
+  waitlistUrl?: string;
 } & TransferableOption &
   SignUpForceRedirectUrl &
   SignUpFallbackRedirectUrl &
@@ -956,6 +1000,11 @@ export type SignUpProps = RoutingOptions & {
    * Enable experimental flags to gain access to new features. These flags are not guaranteed to be stable and may change drastically in between patch or minor versions.
    */
   __experimental?: Record<string, any> & { newComponents?: boolean };
+  /**
+   * Full URL or path to for the waitlist process.
+   * Used to fill the "Join waitlist" link in the SignUp component.
+   */
+  waitlistUrl?: string;
 } & SignInFallbackRedirectUrl &
   SignInForceRedirectUrl &
   LegacyRedirectProps &
@@ -1248,6 +1297,25 @@ export type OrganizationListProps = {
   hideSlug?: boolean;
 };
 
+export type WaitlistProps = {
+  /**
+   * Full URL or path to navigate after successful waitlist submission.
+   */
+  redirectUrl?: string;
+  /**
+   * Customisation options to fully match the Clerk components to your own brand.
+   * These options serve as overrides and will be merged with the global `appearance`
+   * prop of ClerkProvided (if one is provided)
+   */
+  appearance?: WaitlistTheme;
+  /**
+   * Full URL or path where the SignIn component is mounted.
+   */
+  signInUrl?: string;
+};
+
+export type WaitlistModalProps = WaitlistProps;
+
 export interface HandleEmailLinkVerificationParams {
   /**
    * Full URL or path to navigate after successful magic link verification
@@ -1290,6 +1358,10 @@ export interface ClerkAuthenticateWithWeb3Params {
   __experimental_legalAccepted?: boolean;
 }
 
+export type JoinWaitlistParams = {
+  emailAddress: string;
+};
+
 export interface AuthenticateWithMetamaskParams {
   customNavigate?: (to: string) => Promise<unknown>;
   redirectUrl?: string;
diff --git a/packages/types/src/displayConfig.ts b/packages/types/src/displayConfig.ts
index bd25208f27..edc861eebd 100644
--- a/packages/types/src/displayConfig.ts
+++ b/packages/types/src/displayConfig.ts
@@ -40,6 +40,7 @@ export interface DisplayConfigJSON {
   show_devmode_warning: boolean;
   terms_url: string;
   privacy_policy_url: string;
+  waitlist_url: string;
 }
 
 export interface DisplayConfigResource extends ClerkResource {
@@ -82,4 +83,5 @@ export interface DisplayConfigResource extends ClerkResource {
   showDevModeWarning: boolean;
   termsUrl: string;
   privacyPolicyUrl: string;
+  waitlistUrl: string;
 }
diff --git a/packages/types/src/elementIds.ts b/packages/types/src/elementIds.ts
index 69bc36ce17..dea1a17bfb 100644
--- a/packages/types/src/elementIds.ts
+++ b/packages/types/src/elementIds.ts
@@ -48,7 +48,7 @@ export type OrganizationPreviewId =
   | 'organizationSwitcherListedOrganization'
   | 'organizationSwitcherActiveOrganization';
 
-export type CardActionId = 'havingTrouble' | 'alternativeMethods' | 'signUp' | 'signIn' | 'usePasskey';
+export type CardActionId = 'havingTrouble' | 'alternativeMethods' | 'signUp' | 'signIn' | 'usePasskey' | 'waitlist';
 
 export type MenuId = 'invitation' | 'member' | ProfileSectionId;
 export type SelectId = 'countryCode' | 'role';
diff --git a/packages/types/src/index.ts b/packages/types/src/index.ts
index b8ccf135b7..95f8505e8a 100644
--- a/packages/types/src/index.ts
+++ b/packages/types/src/index.ts
@@ -61,3 +61,4 @@ export * from './pagination';
 export * from './passkey';
 export * from './customMenuItems';
 export * from './samlConnection';
+export * from './waitlist';
diff --git a/packages/types/src/json.ts b/packages/types/src/json.ts
index 6e249fdaa8..01c1f89cc7 100644
--- a/packages/types/src/json.ts
+++ b/packages/types/src/json.ts
@@ -530,3 +530,10 @@ export interface SamlAccountConnectionJSON extends ClerkResourceJSON {
   created_at: number;
   updated_at: number;
 }
+
+export interface WaitlistJSON extends ClerkResourceJSON {
+  object: 'waitlist';
+  id: string;
+  created_at: number;
+  updated_at: number;
+}
diff --git a/packages/types/src/localization.ts b/packages/types/src/localization.ts
index ef95d7564a..99b8780e4c 100644
--- a/packages/types/src/localization.ts
+++ b/packages/types/src/localization.ts
@@ -147,9 +147,11 @@ type _LocalizationResource = {
     restrictedAccess: {
       title: LocalizationValue;
       subtitle: LocalizationValue;
+      subtitleWaitlist: LocalizationValue;
       actionLink: LocalizationValue;
       actionText: LocalizationValue;
       blockButton__emailSupport: LocalizationValue;
+      blockButton__joinWaitlist: LocalizationValue;
     };
     __experimental_legalConsent: {
       continue: {
@@ -174,6 +176,8 @@ type _LocalizationResource = {
       actionLink__use_username: LocalizationValue;
       actionLink__use_email_username: LocalizationValue;
       actionLink__use_passkey: LocalizationValue;
+      actionText__join_waitlist: LocalizationValue;
+      actionLink__join_waitlist: LocalizationValue;
     };
     password: {
       title: LocalizationValue;
@@ -800,6 +804,20 @@ type _LocalizationResource = {
     next6Days: LocalizationValue;
     numeric: LocalizationValue;
   };
+  waitlist: {
+    start: {
+      title: LocalizationValue;
+      subtitle: LocalizationValue;
+      formButton: LocalizationValue;
+      actionText: LocalizationValue;
+      actionLink: LocalizationValue;
+    };
+    success: {
+      title: LocalizationValue;
+      subtitle: LocalizationValue;
+      message: LocalizationValue;
+    };
+  };
 };
 
 type WithParamName<T> = T &
diff --git a/packages/types/src/userSettings.ts b/packages/types/src/userSettings.ts
index fafebce3fb..847109d801 100644
--- a/packages/types/src/userSettings.ts
+++ b/packages/types/src/userSettings.ts
@@ -47,7 +47,7 @@ export type SignInData = {
   };
 };
 
-export type SignUpModes = 'public' | 'restricted';
+export type SignUpModes = 'public' | 'restricted' | 'waitlist';
 
 export type SignUpData = {
   allowlist_only: boolean;
diff --git a/packages/types/src/waitlist.ts b/packages/types/src/waitlist.ts
new file mode 100644
index 0000000000..8b8fe3a7ee
--- /dev/null
+++ b/packages/types/src/waitlist.ts
@@ -0,0 +1,7 @@
+import type { ClerkResource } from './resource';
+
+export interface WaitlistResource extends ClerkResource {
+  id: string;
+  createdAt: Date | null;
+  updatedAt: Date | null;
+}
diff --git a/playground/nextjs/pages/_app.tsx b/playground/nextjs/pages/_app.tsx
index bb19af04c9..7d63f5fc75 100644
--- a/playground/nextjs/pages/_app.tsx
+++ b/playground/nextjs/pages/_app.tsx
@@ -71,6 +71,7 @@ function MyApp({ Component, pageProps }: AppProps) {
         },
       }}
       {...pageProps}
+      waitlistUrl='/waitlist'
     >
       <AppBar
         onChangeTheme={e => setSelectedTheme(e.target.value as any)}
diff --git a/playground/nextjs/pages/index.tsx b/playground/nextjs/pages/index.tsx
index 7d9249dcb3..be8876e407 100644
--- a/playground/nextjs/pages/index.tsx
+++ b/playground/nextjs/pages/index.tsx
@@ -2,8 +2,11 @@ import type { NextPage } from 'next';
 import Head from 'next/head';
 import Link from 'next/link';
 import styles from '../styles/Home.module.css';
+import { useClerk } from '@clerk/nextjs';
 
 const Home: NextPage = () => {
+  const clerk = useClerk();
+
   return (
     <div className={styles.container}>
       <Head>
@@ -49,6 +52,12 @@ const Home: NextPage = () => {
           <li>
             <Link href={'/user-examples'}>User examples</Link>
           </li>
+          <li>
+            <Link href={'/waitlist'}>Waitlist</Link>
+          </li>
+          <li>
+            <button type='button' onClick={() => clerk.redirectToWaitlist()}>Redirect to waitlist</button>
+          </li>
         </ul>
       </main>
     </div>
diff --git a/playground/nextjs/pages/waitlist/index.tsx b/playground/nextjs/pages/waitlist/index.tsx
new file mode 100644
index 0000000000..899280f67c
--- /dev/null
+++ b/playground/nextjs/pages/waitlist/index.tsx
@@ -0,0 +1,19 @@
+import type {  NextPage } from 'next';
+import { Waitlist, useClerk } from '@clerk/nextjs';
+
+const WaitlistPage: NextPage = () => {
+  const clerk = useClerk();
+
+  return (
+    <>
+      <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center' }}>
+        <Waitlist />
+      </div>
+      <div style={{ textAlign: 'center' , marginTop: '1rem' }}>
+        <button type='button' onClick={() => clerk.openWaitlist()}>open waitlist</button>
+      </div>
+    </>
+  )
+}
+
+export default WaitlistPage;
\ No newline at end of file