[blocked] New Icon component

docs/index.mdx

@@ -37,73 +37,73 @@ Find all the guides and resources you need to develop with Clerk.
 <Cards variant="plain" cols={3}>
   - [Next.js](/docs/quickstarts/nextjs)
   - Easily add secure, beautiful, and fast authentication to Next.js with Clerk.
-  - {<Include src="_partials/icons/nextjs" />}
+  - {<Icon name="nextjs" />}
 
   ---
 
   - [React](/docs/quickstarts/react)
   - Get started installing and initializing Clerk in a new React + Vite app.
-  - {<Include src="_partials/icons/react" />}
+  - {<Icon name="react" />}
 
   ---
 
   - [Astro](/docs/quickstarts/astro)
   - Easily add secure and SSR-friendly authentication to your Astro application with Clerk.
-  - {<Include src="_partials/icons/astro" />}
+  - {<Icon name="astro" />}
 
   ---
 
   - [Chrome Extension](/docs/quickstarts/chrome-extension)
   - Use the Chrome Extension SDK to authenticate users in your Chrome extension.
-  - {<Include src="_partials/icons/chrome-extension" />}
+  - {<Icon name="chrome" />}
 
   ---
 
   - [Expo](/docs/quickstarts/expo)
   - Use Clerk with Expo to authenticate users in your React Native application.
-  - {<Include src="_partials/icons/expo" />}
+  - {<Icon name="expo" />}
 
   ---
 
   - [iOS (beta)](/docs/quickstarts/ios)
   - Use the Clerk iOS SDK to authenticate users in your native Apple applications.
-  - {<Include src="_partials/icons/ios" />}
+  - {<Icon name="apple" />}
 
   ---
 
   - [JavaScript](/docs/quickstarts/javascript)
   - The Clerk JavaScript SDK gives you access to prebuilt components and helpers to make user authentication easier.
-  - {<Include src="_partials/icons/javascript" />}
+  - {<Icon name="javascript" />}
 
   ---
 
   - [Nuxt](/docs/quickstarts/nuxt)
   - Easily add secure, beautiful, and fast authentication to Nuxt with Clerk.
-  - {<Include src="_partials/icons/nuxt" />}
+  - {<Icon name="nuxt" />}
 
   ---
 
   - [React Router](/docs/quickstarts/react-router)
   - Easily add secure, edge- and SSR-friendly authentication to React Router with Clerk.
-  - {<Include src="_partials/icons/react-router" />}
+  - {<Icon name="react-router" />}
 
   ---
 
   - [Remix](/docs/quickstarts/remix)
   - Easily add secure, edge- and SSR-friendly authentication to Remix with Clerk.
-  - {<Include src="_partials/icons/remix" />}
+  - {<Icon name="remix" />}
 
   ---
 
   - [TanStack Start (beta)](/docs/quickstarts/tanstack-start)
   - Easily add secure and SSR-friendly authentication to your TanStack Start application with Clerk.
-  - {<Include src="_partials/icons/tanstack-start" />}
+  - {<Icon name="tanstack" />}
 
   ---
 
   - [Vue](/docs/quickstarts/vue)
   - Get started installing and initializing Clerk in a new Vue + Vite app.
-  - {<Include src="_partials/icons/vue" />}
+  - {<Icon name="vue" />}
 </Cards>
 
 ## Explore by backend framework
@@ -113,43 +113,43 @@ Find all the guides and resources you need to develop with Clerk.
 <Cards variant="plain" cols={3}>
   - [JS Backend SDK](/docs/references/backend/overview)
   - The Clerk Backend SDK exposes our Backend API resources and low-level authentication utilities for JavaScript environments.
-  - {<Include src="_partials/icons/backend-sdk" />}
+  - {<Icon name="clerk" />}
 
   ---
 
   - [C#](https://github.com/clerk/clerk-sdk-csharp/blob/main/README.md)
   - The Clerk C# SDK is a wrapper around our Backend API to make it easier to integrate Clerk into your backend.
-  - {<Include src="_partials/icons/c-sharp" />}
+  - {<Icon name="csharp" />}
 
   ---
 
   - [Express](/docs/quickstarts/express)
   - Quickly add authentication and user management to your Express application.
-  - {<Include src="_partials/icons/express" />}
+  - {<Icon name="expressjs" />}
 
   ---
 
   - [Go](/docs/references/go/overview)
   - The Clerk Go SDK is a wrapper around the Backend API written in Golang to make it easier to integrate Clerk into your backend.
-  - {<Include src="_partials/icons/go" />}
+  - {<Icon name="go" />}
 
   ---
 
   - [Fastify](/docs/quickstarts/fastify)
   - Build secure authentication and user management flows for your Fastify server.
-  - {<Include src="_partials/icons/fastify" />}
+  - {<Icon name="fastify" />}
 
   ---
 
   - [Python](https://github.com/clerk/clerk-sdk-python/blob/main/README.md)
   - The Clerk Python SDK is a wrapper around the Backend API written in Python to make it easier to integrate Clerk into your backend.
-  - {<Include src="_partials/icons/python" />}
+  - {<Icon name="python" />}
 
   ---
 
   - [Ruby on Rails](/docs/quickstarts/ruby)
   - Integrate authentication and user management into your Ruby application.
-  - {<Include src="_partials/icons/ruby.mdx" />}
+  - {<Icon name="ruby" />}
 </Cards>
 
 ## Explore by feature

docs/quickstarts/overview.mdx

@@ -8,89 +8,89 @@ description: See the getting started guides and tutorials.
 <Cards>
   - [Next.js](/docs/quickstarts/nextjs)
   - Easily add secure, beautiful, and fast authentication to your Next.js application with Clerk.
-  - {<Include src="_partials/icons/nextjs" />}
+  - {<Icon name="nextjs" />}
 
   ---
 
   - [Astro](/docs/quickstarts/astro)
   - Easily add secure and SSR-friendly authentication to your Astro application with Clerk.
-  - {<Include src="_partials/icons/astro" />}
+  - {<Icon name="astro" />}
 
   ---
 
   - [Nuxt](/docs/quickstarts/nuxt)
   - Easily add secure, beautiful, and fast authentication to Nuxt with Clerk.
-  - {<Include src="_partials/icons/nuxt" />}
+  - {<Icon name="nuxt" />}
 
   ---
 
   - [React Router (Beta)](/docs/quickstarts/react-router)
   - The Clerk React Router SDK provides prebuilt components, hooks, and stores to make it easy to integrate authentication and user management in your React Router app.
-  - {<Include src="_partials/icons/react-router" />}
+  - {<Icon name="react-router" />}
 
   ---
 
   - [Remix](/docs/quickstarts/remix)
   - Easily add secure, edge- and SSR-friendly authentication to your Remix application with Clerk.
-  - {<Include src="_partials/icons/remix" />}
+  - {<Icon name="remix" />}
 
   ---
 
   - [TanStack Start (beta)](/docs/quickstarts/tanstack-start)
   - Easily add secure and SSR-friendly authentication to your TanStack Start application with Clerk.
-  - {<Include src="_partials/icons/tanstack-start" />}
+  - {<Icon name="tanstack" />}
 </Cards>
 
 ## Frontend
 
 <Cards>
   - [React](/docs/quickstarts/react)
   - Easily add secure, beautiful, and fast authentication to your React application with Clerk.
-  - {<Include src="_partials/icons/react" />}
+  - {<Icon name="react" />}
 
   ---
 
   - [Chrome Extension](/docs/quickstarts/chrome-extension)
   - Use the Chrome Extension SDK to authenticate users in your Chrome extension.
-  - {<Include src="_partials/icons/chrome-extension" />}
+  - {<Icon name="chrome" />}
 
   ---
 
   - [Expo](/docs/quickstarts/expo)
   - Use Clerk with Expo to authenticate users in your React Native application.
-  - {<Include src="_partials/icons/expo" />}
+  - {<Icon name="expo" />}
 
   ---
 
   - [iOS (beta)](/docs/quickstarts/ios)
   - Use the Clerk iOS SDK to authenticate users in your native Apple applications.
-  - {<Include src="_partials/icons/ios" />}
+  - {<Icon name="apple" />}
 
   ---
 
   - [JavaScript](/docs/quickstarts/javascript)
   - Easily add secure, beautiful, and fast authentication to your JavaScript application with Clerk.
-  - {<Include src="_partials/icons/javascript" />}
+  - {<Icon name="javascript" />}
 
   ---
 
   - [Vue](/docs/quickstarts/vue)
   - Easily add secure, beautiful, and fast authentication to your Vue application with Clerk.
-  - {<Include src="_partials/icons/vue" />}
+  - {<Icon name="vue" />}
 </Cards>
 
 ## Backend
 
 <Cards>
   - [Express](/docs/quickstarts/express)
   - Easily add secure, beautiful, and fast authentication to your Express application with Clerk.
-  - {<Include src="_partials/icons/express" />}
+  - {<Icon name="expressjs" />}
 
   ---
 
   - [Fastify](/docs/quickstarts/fastify)
   - Easily add secure, beautiful, and fast authentication to your Fastify application with Clerk.
-  - {<Include src="_partials/icons/fastify" />}
+  - {<Icon name="fastify" />}
 </Cards>
 
 <Include src="_partials/help" />

docs/references/overview.mdx

@@ -10,117 +10,117 @@ description: Learn about the Clerk and community SDK's available for integrating
 <Cards>
   - [Next.js](/docs/references/nextjs/overview)
   - Easily add secure, beautiful, and fast authentication to Next.js with Clerk.
-  - {<Include src="_partials/icons/nextjs" />}
+  - {<Icon name="nextjs" />}
 
   ---
 
   - [React](/docs/references/react/overview)
   - Get started installing and initializing Clerk in a new React + Vite app.
-  - {<Include src="_partials/icons/react" />}
+  - {<Icon name="react" />}
 
   ---
 
   - [Astro](/docs/references/astro/overview)
   - Easily add secure and SSR-friendly authentication to your Astro application with Clerk.
-  - {<Include src="_partials/icons/astro" />}
+  - {<Icon name="astro" />}
 
   ---
 
   - [Chrome Extension](/docs/references/chrome-extension/overview)
   - Use the Chrome Extension SDK to authenticate users in your Chrome extension.
-  - {<Include src="_partials/icons/chrome-extension" />}
+  - {<Icon name="chrome" />}
 
   ---
 
   - [Expo](/docs/references/expo/overview)
   - Use Clerk with Expo to authenticate users in your React Native application.
-  - {<Include src="_partials/icons/expo" />}
+  - {<Icon name="expo" />}
 
   ---
 
   - [iOS (beta)](/docs/references/ios/overview)
   - Use the Clerk iOS SDK to authenticate users in your native Apple applications.
-  - {<Include src="_partials/icons/ios" />}
+  - {<Icon name="apple" />}
 
   ---
 
   - [JavaScript](/docs/references/javascript/overview)
   - The Clerk JavaScript SDK gives you access to prebuilt components and helpers to make user authentication easier.
-  - {<Include src="_partials/icons/javascript" />}
+  - {<Icon name="javascript" />}
 
   ---
 
   - [Nuxt](/docs/references/nuxt/overview)
   - Easily add secure, beautiful, and fast authentication to Nuxt with Clerk.
-  - {<Include src="_partials/icons/nuxt" />}
+  - {<Icon name="nuxt" />}
 
   ---
 
   - [React Router](/docs/references/react-router/overview)
   - Easily add secure, edge- and SSR-friendly authentication to React Router with Clerk.
-  - {<Include src="_partials/icons/react-router" />}
+  - {<Icon name="react-router" />}
 
   ---
 
   - [Remix](/docs/references/remix/overview)
   - Easily add secure, edge- and SSR-friendly authentication to Remix with Clerk.
-  - {<Include src="_partials/icons/remix" />}
+  - {<Icon name="remix" />}
 
   ---
 
   - [TanStack Start (beta)](/docs/references/tanstack-start/overview)
   - Easily add secure and SSR-friendly authentication to your TanStack Start application with Clerk.
-  - {<Include src="_partials/icons/tanstack-start" />}
+  - {<Icon name="tanstack" />}
 
   ---
 
   - [Vue](/docs/references/vue/overview)
   - Get started installing and initializing Clerk in a new Vue + Vite app.
-  - {<Include src="_partials/icons/vue" />}
+  - {<Icon name="vue" />}
 </Cards>
 
 ## Backend SDKs
 
 <Cards>
   - [JS Backend SDK](/docs/references/backend/overview)
   - The Clerk Backend SDK exposes our Backend API resources and low-level authentication utilities for JavaScript environments.
-  - {<Include src="_partials/icons/backend-sdk" />}
+  - {<Icon name="clerk" />}
 
   ---
 
   - [C#](https://github.com/clerk/clerk-sdk-csharp/blob/main/README.md)
   - The Clerk C# SDK is a wrapper around our Backend API to make it easier to integrate Clerk into your backend.
-  - {<Include src="_partials/icons/c-sharp" />}
+  - {<Icon name="csharp" />}
 
   ---
 
   - [Express](/docs/references/express/overview)
   - Quickly add authentication and user management to your Express application.
-  - {<Include src="_partials/icons/express" />}
+  - {<Icon name="expressjs" />}
 
   ---
 
   - [Go](/docs/references/go/overview)
   - The Clerk Go SDK is a wrapper around the Backend API written in Golang to make it easier to integrate Clerk into your backend.
-  - {<Include src="_partials/icons/go" />}
+  - {<Icon name="go" />}
 
   ---
 
   - [Fastify](/docs/references/fastify/overview)
   - Build secure authentication and user management flows for your Fastify server.
-  - {<Include src="_partials/icons/fastify" />}
+  - {<Icon name="fastify" />}
 
   ---
 
   - [Python](https://github.com/clerk/clerk-sdk-python/blob/main/README.md)
   - The Clerk Python SDK is a wrapper around the Backend API written in Python to make it easier to integrate Clerk into your backend.
-  - {<Include src="_partials/icons/python" />}
+  - {<Icon name="python" />}
 
   ---
 
   - [Ruby on Rails](/docs/references/ruby/overview)
   - Integrate authentication and user management into your Ruby application.
-  - {<Include src="_partials/icons/ruby.mdx" />}
+  - {<Icon name="ruby" />}
 </Cards>
 
 ## Build with community-maintained SDKs