diff --git a/.changeset/smooth-signs-type.md b/.changeset/smooth-signs-type.md
new file mode 100644
index 00000000000..fa80dc759d9
--- /dev/null
+++ b/.changeset/smooth-signs-type.md
@@ -0,0 +1,7 @@
+---
+'@clerk/localizations': patch
+'@clerk/clerk-js': patch
+'@clerk/types': patch
+---
+
+Update SubscriptionsList UI to be rendered within ProfileSections within UserProfile and OrganizationProfile.
diff --git a/integration/tests/pricing-table.test.ts b/integration/tests/pricing-table.test.ts
index 365a0d44611..67e6bc41d8b 100644
--- a/integration/tests/pricing-table.test.ts
+++ b/integration/tests/pricing-table.test.ts
@@ -113,7 +113,7 @@ testAgainstRunningApps({ withEnv: [appConfigs.envs.withBilling] })('pricing tabl
 
       await u.po.userProfile.waitForMounted();
       await u.po.userProfile.switchToBillingTab();
-      await u.po.page.getByRole('button', { name: 'View all plans' }).click();
+      await u.po.page.getByRole('button', { name: 'Switch plans' }).click();
       await u.po.pricingTable.waitForMounted();
       await expect(u.po.page.getByRole('heading', { name: 'Pro' })).toBeVisible();
     });
diff --git a/packages/clerk-js/bundlewatch.config.json b/packages/clerk-js/bundlewatch.config.json
index 0c6154cc81d..cbafeb4b68a 100644
--- a/packages/clerk-js/bundlewatch.config.json
+++ b/packages/clerk-js/bundlewatch.config.json
@@ -23,8 +23,8 @@
     { "path": "./dist/pricingTable*.js", "maxSize": "4.02KB" },
     { "path": "./dist/checkout*.js", "maxSize": "5.79KB" },
     { "path": "./dist/paymentSources*.js", "maxSize": "9.06KB" },
-    { "path": "./dist/up-billing-page*.js", "maxSize": "2.4KB" },
-    { "path": "./dist/op-billing-page*.js", "maxSize": "2.4KB" },
+    { "path": "./dist/up-billing-page*.js", "maxSize": "2.5KB" },
+    { "path": "./dist/op-billing-page*.js", "maxSize": "2.5KB" },
     { "path": "./dist/sessionTasks*.js", "maxSize": "1KB" }
   ]
 }
diff --git a/packages/clerk-js/src/ui/components/Checkout/CheckoutForm.tsx b/packages/clerk-js/src/ui/components/Checkout/CheckoutForm.tsx
index 917c1b61ca1..5c9711d090b 100644
--- a/packages/clerk-js/src/ui/components/Checkout/CheckoutForm.tsx
+++ b/packages/clerk-js/src/ui/components/Checkout/CheckoutForm.tsx
@@ -14,7 +14,7 @@ import { useCheckoutContext } from '../../contexts';
 import { Box, Button, Col, descriptors, Form, localizationKeys, Text } from '../../customizables';
 import { Alert, Drawer, LineItems, SegmentedControl, Select, SelectButton, SelectOptionList } from '../../elements';
 import { useFetch } from '../../hooks';
-import { ArrowUpDown } from '../../icons';
+import { ChevronUpDown } from '../../icons';
 import { animations } from '../../styledSystem';
 import { handleError } from '../../utils';
 import { AddPaymentSource, PaymentSourceRow } from '../PaymentSources';
@@ -309,7 +309,7 @@ const ExistingPaymentSourceForm = ({
             value={selectedPaymentSource?.id}
           />
           <SelectButton
-            icon={ArrowUpDown}
+            icon={ChevronUpDown}
             sx={t => ({
               justifyContent: 'space-between',
               backgroundColor: t.colors.$colorBackground,
diff --git a/packages/clerk-js/src/ui/components/OrganizationProfile/OrganizationBillingPage.tsx b/packages/clerk-js/src/ui/components/OrganizationProfile/OrganizationBillingPage.tsx
index 9508903eb71..3e5d8a0d5f0 100644
--- a/packages/clerk-js/src/ui/components/OrganizationProfile/OrganizationBillingPage.tsx
+++ b/packages/clerk-js/src/ui/components/OrganizationProfile/OrganizationBillingPage.tsx
@@ -6,11 +6,12 @@ import {
   SubscriberTypeContext,
   useSubscriptions,
 } from '../../contexts';
-import { Button, Col, descriptors, Flex, localizationKeys } from '../../customizables';
+import { Col, descriptors, Flex, localizationKeys } from '../../customizables';
 import {
   Alert,
   Card,
   Header,
+  ProfileSection,
   Tab,
   TabPanel,
   TabPanels,
@@ -20,6 +21,7 @@ import {
   withCardStateProvider,
 } from '../../elements';
 import { useTabState } from '../../hooks/useTabState';
+import { ArrowsUpDown } from '../../icons';
 import { useRouter } from '../../router';
 import { InvoicesList } from '../Invoices';
 import { PaymentSources } from '../PaymentSources';
@@ -53,7 +55,7 @@ const OrganizationBillingPageInternal = withCardStateProvider(() => {
       >
         <Header.Root>
           <Header.Title
-            localizationKey={localizationKeys('userProfile.billingPage.title')}
+            localizationKey={localizationKeys('organizationProfile.billingPage.title')}
             textVariant='h2'
           />
         </Header.Root>
@@ -68,56 +70,70 @@ const OrganizationBillingPageInternal = withCardStateProvider(() => {
             <Tab
               localizationKey={
                 subscriptions.data.length > 0
-                  ? localizationKeys('userProfile.billingPage.start.headerTitle__subscriptions')
-                  : localizationKeys('userProfile.billingPage.start.headerTitle__plans')
+                  ? localizationKeys('organizationProfile.billingPage.start.headerTitle__subscriptions')
+                  : localizationKeys('organizationProfile.billingPage.start.headerTitle__plans')
               }
             />
-            <Tab localizationKey={localizationKeys('userProfile.billingPage.start.headerTitle__invoices')} />
+            <Tab localizationKey={localizationKeys('organizationProfile.billingPage.start.headerTitle__invoices')} />
           </TabsList>
           <TabPanels>
             <TabPanel sx={{ width: '100%', flexDirection: 'column' }}>
-              <Flex
-                sx={{ width: '100%', flexDirection: 'column' }}
-                gap={4}
-              >
-                {subscriptions.data.length > 0 ? (
-                  <>
+              {subscriptions.data.length > 0 ? (
+                <Flex
+                  sx={{ width: '100%', flexDirection: 'column' }}
+                  gap={4}
+                >
+                  <ProfileSection.Root
+                    id='subscriptionsList'
+                    title={localizationKeys('organizationProfile.billingPage.subscriptionsListSection.title')}
+                    centered={false}
+                    sx={t => ({
+                      borderTop: 'none',
+                      paddingTop: t.space.$1,
+                    })}
+                  >
                     <Protect condition={has => !has({ permission: 'org:sys_billing:manage' })}>
                       <Alert
                         variant='info'
                         colorScheme='info'
-                        title={localizationKeys('organizationProfile.billingPage.alerts.noPemissionsToManageBilling')}
+                        title={localizationKeys('organizationProfile.billingPage.alerts.noPermissionsToManageBilling')}
                       />
                     </Protect>
                     <SubscriptionsList />
-                    <Button
-                      localizationKey='View all plans'
-                      hasArrow
-                      variant='ghost'
-                      onClick={() => navigate('plans')}
-                      sx={{
-                        width: 'fit-content',
-                      }}
+                    <ProfileSection.ArrowButton
+                      id='subscriptionsList'
+                      textLocalizationKey={localizationKeys(
+                        'organizationProfile.billingPage.subscriptionsListSection.actionLabel__switchPlan',
+                      )}
+                      sx={[
+                        t => ({
+                          justifyContent: 'start',
+                          height: t.sizes.$8,
+                        }),
+                      ]}
+                      leftIcon={ArrowsUpDown}
+                      leftIconSx={t => ({ width: t.sizes.$4, height: t.sizes.$4 })}
+                      onClick={() => void navigate('plans')}
                     />
-                    <Protect condition={has => has({ permission: 'org:sys_billing:manage' })}>
-                      <PaymentSources />
-                    </Protect>
-                  </>
-                ) : (
-                  <>
-                    <Protect condition={has => !has({ permission: 'org:sys_billing:manage' })}>
-                      <Alert
-                        variant='info'
-                        colorScheme='info'
-                        title={localizationKeys('organizationProfile.billingPage.alerts.noPemissionsToManageBilling')}
-                      />
-                    </Protect>
-                    <PricingTableContext.Provider value={{ componentName: 'PricingTable', mode: 'modal' }}>
-                      <PricingTable />
-                    </PricingTableContext.Provider>
-                  </>
-                )}
-              </Flex>
+                  </ProfileSection.Root>
+                  <Protect condition={has => has({ permission: 'org:sys_billing:manage' })}>
+                    <PaymentSources />
+                  </Protect>
+                </Flex>
+              ) : (
+                <>
+                  <Protect condition={has => !has({ permission: 'org:sys_billing:manage' })}>
+                    <Alert
+                      variant='info'
+                      colorScheme='info'
+                      title={localizationKeys('organizationProfile.billingPage.alerts.noPermissionsToManageBilling')}
+                    />
+                  </Protect>
+                  <PricingTableContext.Provider value={{ componentName: 'PricingTable', mode: 'modal' }}>
+                    <PricingTable />
+                  </PricingTableContext.Provider>
+                </>
+              )}
             </TabPanel>
             <TabPanel sx={{ width: '100%' }}>
               <InvoicesContextProvider>
diff --git a/packages/clerk-js/src/ui/components/OrganizationProfile/OrganizationPlansPage.tsx b/packages/clerk-js/src/ui/components/OrganizationProfile/OrganizationPlansPage.tsx
index 37219b59192..98fb2b6433d 100644
--- a/packages/clerk-js/src/ui/components/OrganizationProfile/OrganizationPlansPage.tsx
+++ b/packages/clerk-js/src/ui/components/OrganizationProfile/OrganizationPlansPage.tsx
@@ -36,7 +36,7 @@ const OrganizationPlansPageInternal = () => {
           <Alert
             variant='info'
             colorScheme='info'
-            title={localizationKeys('organizationProfile.billingPage.alerts.noPemissionsToManageBilling')}
+            title={localizationKeys('organizationProfile.billingPage.alerts.noPermissionsToManageBilling')}
           />
         </Protect>
         <PricingTableContext.Provider value={{ componentName: 'PricingTable', mode: 'modal' }}>
diff --git a/packages/clerk-js/src/ui/components/PaymentSources/PaymentSources.tsx b/packages/clerk-js/src/ui/components/PaymentSources/PaymentSources.tsx
index 0285de5ae0f..386a66b67ef 100644
--- a/packages/clerk-js/src/ui/components/PaymentSources/PaymentSources.tsx
+++ b/packages/clerk-js/src/ui/components/PaymentSources/PaymentSources.tsx
@@ -102,7 +102,7 @@ export const PaymentSources = () => {
     <ProfileSection.Root
       title={localizationKeys('userProfile.billingPage.paymentSourcesSection.title')}
       centered={false}
-      id='profile'
+      id='paymentSources'
       sx={t => ({
         flex: 1,
         borderTopWidth: t.borderWidths.$normal,
diff --git a/packages/clerk-js/src/ui/components/UserProfile/BillingPage.tsx b/packages/clerk-js/src/ui/components/UserProfile/BillingPage.tsx
index 42f2074ba59..16d8a3b6f8d 100644
--- a/packages/clerk-js/src/ui/components/UserProfile/BillingPage.tsx
+++ b/packages/clerk-js/src/ui/components/UserProfile/BillingPage.tsx
@@ -5,10 +5,11 @@ import {
   SubscriberTypeContext,
   useSubscriptions,
 } from '../../contexts';
-import { Button, Col, descriptors, Flex, localizationKeys } from '../../customizables';
+import { Col, descriptors, localizationKeys } from '../../customizables';
 import {
   Card,
   Header,
+  ProfileSection,
   Tab,
   TabPanel,
   TabPanels,
@@ -18,6 +19,7 @@ import {
   withCardStateProvider,
 } from '../../elements';
 import { useTabState } from '../../hooks/useTabState';
+import { ArrowsUpDown } from '../../icons';
 import { useRouter } from '../../router';
 import { InvoicesList } from '../Invoices';
 import { PaymentSources } from '../PaymentSources';
@@ -77,22 +79,38 @@ const BillingPageInternal = withCardStateProvider(() => {
           <TabPanels>
             <TabPanel sx={_ => ({ width: '100%', flexDirection: 'column' })}>
               {subscriptions.data.length > 0 ? (
-                <Flex
-                  sx={{ width: '100%', flexDirection: 'column' }}
-                  gap={4}
-                >
-                  <SubscriptionsList />
-                  <Button
-                    localizationKey='View all plans'
-                    hasArrow
-                    variant='ghost'
-                    onClick={() => navigate('plans')}
-                    sx={{
-                      width: 'fit-content',
-                    }}
-                  />
+                <>
+                  <ProfileSection.Root
+                    id='subscriptionsList'
+                    title={localizationKeys('userProfile.billingPage.subscriptionsListSection.title')}
+                    centered={false}
+                    sx={t => ({
+                      borderTop: 'none',
+                      paddingTop: t.space.$1,
+                    })}
+                  >
+                    <SubscriptionsList />
+                    <ProfileSection.ArrowButton
+                      id='subscriptionsList'
+                      textLocalizationKey={localizationKeys(
+                        'userProfile.billingPage.subscriptionsListSection.actionLabel__switchPlan',
+                      )}
+                      sx={[
+                        t => ({
+                          justifyContent: 'start',
+                          height: t.sizes.$8,
+                        }),
+                      ]}
+                      leftIcon={ArrowsUpDown}
+                      leftIconSx={t => ({
+                        width: t.sizes.$4,
+                        height: t.sizes.$4,
+                      })}
+                      onClick={() => void navigate('plans')}
+                    />
+                  </ProfileSection.Root>
                   <PaymentSources />
-                </Flex>
+                </>
               ) : (
                 <PricingTableContext.Provider value={{ componentName: 'PricingTable', mode: 'modal' }}>
                   <PricingTable />
diff --git a/packages/clerk-js/src/ui/elements/PhoneInput/PhoneInput.tsx b/packages/clerk-js/src/ui/elements/PhoneInput/PhoneInput.tsx
index 5dc81fee5b0..fa20c053353 100644
--- a/packages/clerk-js/src/ui/elements/PhoneInput/PhoneInput.tsx
+++ b/packages/clerk-js/src/ui/elements/PhoneInput/PhoneInput.tsx
@@ -3,7 +3,7 @@ import React, { forwardRef, memo, useEffect, useMemo, useRef } from 'react';
 
 import { descriptors, Flex, Icon, Input, Text } from '../../customizables';
 import { Select, SelectButton, SelectOptionList } from '../../elements';
-import { ArrowUpDown, Check } from '../../icons';
+import { Check, ChevronUpDown } from '../../icons';
 import { common, type PropsOfComponent } from '../../styledSystem';
 import type { FeedbackType } from '../../utils';
 import { mergeRefs } from '../../utils';
@@ -128,7 +128,7 @@ const PhoneInputBase = forwardRef<HTMLInputElement, PhoneInputProps & { feedback
           })}
           hoverAsFocus
           isDisabled={rest.isDisabled}
-          icon={ArrowUpDown}
+          icon={ChevronUpDown}
           iconSx={t => ({
             color: rest.isDisabled ? t.colors.$neutralAlpha300 : t.colors.$neutralAlpha500,
           })}
diff --git a/packages/clerk-js/src/ui/icons/arrows-up-down.svg b/packages/clerk-js/src/ui/icons/arrows-up-down.svg
new file mode 100644
index 00000000000..584bf0e8b8a
--- /dev/null
+++ b/packages/clerk-js/src/ui/icons/arrows-up-down.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 7.5 7.5 3m0 0L12 7.5M7.5 3v13.5m13.5 0L16.5 21m0 0L12 16.5m4.5 4.5V7.5"/></svg>
\ No newline at end of file
diff --git a/packages/clerk-js/src/ui/icons/arrow-up-down.svg b/packages/clerk-js/src/ui/icons/chevron-up-down.svg
similarity index 100%
rename from packages/clerk-js/src/ui/icons/arrow-up-down.svg
rename to packages/clerk-js/src/ui/icons/chevron-up-down.svg
diff --git a/packages/clerk-js/src/ui/icons/index.ts b/packages/clerk-js/src/ui/icons/index.ts
index 396b5a354c5..92c80362cbb 100644
--- a/packages/clerk-js/src/ui/icons/index.ts
+++ b/packages/clerk-js/src/ui/icons/index.ts
@@ -9,7 +9,7 @@ export { default as ApplePay } from './apple-pay.svg';
 export { default as ArrowLeftIcon } from './arrow-left.svg';
 export { default as ArrowRightButtonIcon } from './arrow-right-button.svg';
 export { default as ArrowRightIcon } from './arrow-right.svg';
-export { default as ArrowUpDown } from './arrow-up-down.svg';
+export { default as ArrowsUpDown } from './arrows-up-down.svg';
 export { default as AuthApp } from './auth-app.svg';
 export { default as Billing } from './billing.svg';
 export { default as Block } from './block.svg';
@@ -21,6 +21,7 @@ export { default as Check } from './check.svg';
 export { default as CheckCircle } from './check-circle.svg';
 export { default as CheckmarkFilled } from './checkmark-filled.svg';
 export { default as ChevronDown } from './chevron-down.svg';
+export { default as ChevronUpDown } from './chevron-up-down.svg';
 export { default as Clipboard } from './clipboard.svg';
 export { default as Close } from './close.svg';
 export { default as CogFilled } from './cog-filled.svg';
diff --git a/packages/localizations/src/ar-SA.ts b/packages/localizations/src/ar-SA.ts
index ce45effcedd..8701302c8f0 100644
--- a/packages/localizations/src/ar-SA.ts
+++ b/packages/localizations/src/ar-SA.ts
@@ -156,7 +156,7 @@ export const arSA: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'دعوات تلقائية',
diff --git a/packages/localizations/src/be-BY.ts b/packages/localizations/src/be-BY.ts
index e45ca520994..38c6d46d1ee 100644
--- a/packages/localizations/src/be-BY.ts
+++ b/packages/localizations/src/be-BY.ts
@@ -157,7 +157,7 @@ export const beBY: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatic invitations',
diff --git a/packages/localizations/src/bg-BG.ts b/packages/localizations/src/bg-BG.ts
index 2cdf0cd90e3..e658b0b3ad0 100644
--- a/packages/localizations/src/bg-BG.ts
+++ b/packages/localizations/src/bg-BG.ts
@@ -155,7 +155,7 @@ export const bgBG: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Автоматични покани',
diff --git a/packages/localizations/src/ca-ES.ts b/packages/localizations/src/ca-ES.ts
index 031de9a03a7..4ff9cfad859 100644
--- a/packages/localizations/src/ca-ES.ts
+++ b/packages/localizations/src/ca-ES.ts
@@ -155,7 +155,7 @@ export const caES: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Invitacions automàtiques',
diff --git a/packages/localizations/src/cs-CZ.ts b/packages/localizations/src/cs-CZ.ts
index 98f2e9ccf6c..e8d6975635b 100644
--- a/packages/localizations/src/cs-CZ.ts
+++ b/packages/localizations/src/cs-CZ.ts
@@ -157,7 +157,7 @@ export const csCZ: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatic invitations',
diff --git a/packages/localizations/src/da-DK.ts b/packages/localizations/src/da-DK.ts
index 550e88dfe6e..45bfdfede19 100644
--- a/packages/localizations/src/da-DK.ts
+++ b/packages/localizations/src/da-DK.ts
@@ -156,7 +156,7 @@ export const daDK: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatiske invitationer',
diff --git a/packages/localizations/src/de-DE.ts b/packages/localizations/src/de-DE.ts
index 226e1704bc5..53c5811c383 100644
--- a/packages/localizations/src/de-DE.ts
+++ b/packages/localizations/src/de-DE.ts
@@ -158,7 +158,7 @@ export const deDE: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatische Einladungen',
diff --git a/packages/localizations/src/el-GR.ts b/packages/localizations/src/el-GR.ts
index 617f8a695da..ae0f6f6637e 100644
--- a/packages/localizations/src/el-GR.ts
+++ b/packages/localizations/src/el-GR.ts
@@ -156,7 +156,7 @@ export const elGR: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Αυτόματες προσκλήσεις',
diff --git a/packages/localizations/src/en-GB.ts b/packages/localizations/src/en-GB.ts
index bc96e2d2216..5e1bfc8fab6 100644
--- a/packages/localizations/src/en-GB.ts
+++ b/packages/localizations/src/en-GB.ts
@@ -156,7 +156,7 @@ export const enGB: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatic invitations',
diff --git a/packages/localizations/src/en-US.ts b/packages/localizations/src/en-US.ts
index 534cbd4a348..f556735e3b8 100644
--- a/packages/localizations/src/en-US.ts
+++ b/packages/localizations/src/en-US.ts
@@ -143,11 +143,6 @@ export const enUS: LocalizationResource = {
     titleWithoutPersonal: 'Choose an organization',
   },
   organizationProfile: {
-    billingPage: {
-      alerts: {
-        noPemissionsToManageBilling: 'You do not have permissions to manage billing for this account.',
-      },
-    },
     badge__automaticInvitation: 'Automatic invitations',
     badge__automaticSuggestion: 'Automatic suggestions',
     badge__manualInvitation: 'No automatic enrollment',
@@ -297,6 +292,42 @@ export const enUS: LocalizationResource = {
       subtitleVerificationCodeScreen: 'A verification code was sent to {{emailAddress}}. Enter the code to continue.',
       title: 'Verify domain',
     },
+    billingPage: {
+      alerts: {
+        noPermissionsToManageBilling: 'You do not have permissions to manage billing for this account.',
+      },
+      subscriptionsListSection: {
+        actionLabel__switchPlan: 'Switch plans',
+        title: 'Subscription',
+      },
+      paymentSourcesSection: {
+        actionLabel__default: 'Make default',
+        actionLabel__remove: 'Remove',
+        add: 'Add new payment method',
+        addSubtitle: 'Add a new payment method to your account.',
+        cancelButton: 'Cancel',
+        formButtonPrimary__add: 'Add Payment Method',
+        formButtonPrimary__pay: 'Pay {{amount}}',
+        payWithTestCardButton: 'Pay with test card',
+        removeResource: {
+          messageLine1: '{{identifier}} will be removed from this account.',
+          messageLine2:
+            'You will no longer be able to use this payment source and any recurring subscriptions dependent on it will no longer work.',
+          successMessage: '{{paymentSource}} has been removed from your account.',
+          title: 'Remove payment method',
+        },
+        title: 'Payment methods',
+      },
+      start: {
+        headerTitle__invoices: 'Invoices',
+        headerTitle__plans: 'Plans',
+        headerTitle__subscriptions: 'Subscriptions',
+      },
+      subscriptionsSection: {
+        actionLabel__default: 'Manage',
+      },
+      title: 'Billing',
+    },
   },
   organizationSwitcher: {
     action__createOrganization: 'Create organization',
@@ -714,6 +745,10 @@ export const enUS: LocalizationResource = {
       title__codelist: 'Backup codes',
     },
     billingPage: {
+      subscriptionsListSection: {
+        title: 'Subscription',
+        actionLabel__switchPlan: 'Switch plans',
+      },
       paymentSourcesSection: {
         actionLabel__default: 'Make default',
         actionLabel__remove: 'Remove',
diff --git a/packages/localizations/src/es-ES.ts b/packages/localizations/src/es-ES.ts
index 3cd62b53bbb..4a4dab69093 100644
--- a/packages/localizations/src/es-ES.ts
+++ b/packages/localizations/src/es-ES.ts
@@ -156,7 +156,7 @@ export const esES: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Invitaciones automáticas',
diff --git a/packages/localizations/src/es-MX.ts b/packages/localizations/src/es-MX.ts
index 62693ef22ba..12be211a4fe 100644
--- a/packages/localizations/src/es-MX.ts
+++ b/packages/localizations/src/es-MX.ts
@@ -157,7 +157,7 @@ export const esMX: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Invitaciones automaticas',
diff --git a/packages/localizations/src/fi-FI.ts b/packages/localizations/src/fi-FI.ts
index 74c0085ae80..9c9c9b0abb8 100644
--- a/packages/localizations/src/fi-FI.ts
+++ b/packages/localizations/src/fi-FI.ts
@@ -156,7 +156,7 @@ export const fiFI: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automaattiset kutsut',
diff --git a/packages/localizations/src/fr-FR.ts b/packages/localizations/src/fr-FR.ts
index 14fe2550441..eb1783cc938 100644
--- a/packages/localizations/src/fr-FR.ts
+++ b/packages/localizations/src/fr-FR.ts
@@ -157,7 +157,7 @@ export const frFR: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Invitations automatiques',
diff --git a/packages/localizations/src/he-IL.ts b/packages/localizations/src/he-IL.ts
index e622b522440..3b838340c7c 100644
--- a/packages/localizations/src/he-IL.ts
+++ b/packages/localizations/src/he-IL.ts
@@ -155,7 +155,7 @@ export const heIL: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'הזמנות אוטומטיות',
diff --git a/packages/localizations/src/hr-HR.ts b/packages/localizations/src/hr-HR.ts
index 353f220ce1c..6bfab0c32c1 100644
--- a/packages/localizations/src/hr-HR.ts
+++ b/packages/localizations/src/hr-HR.ts
@@ -155,7 +155,7 @@ export const hrHR: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatske pozivnice',
diff --git a/packages/localizations/src/hu-HU.ts b/packages/localizations/src/hu-HU.ts
index 4f2e7b9c8a8..e35f1f85983 100644
--- a/packages/localizations/src/hu-HU.ts
+++ b/packages/localizations/src/hu-HU.ts
@@ -155,7 +155,7 @@ export const huHU: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatikus meghívások',
diff --git a/packages/localizations/src/id-ID.ts b/packages/localizations/src/id-ID.ts
index e0e21d05ca7..80e0150f36d 100644
--- a/packages/localizations/src/id-ID.ts
+++ b/packages/localizations/src/id-ID.ts
@@ -156,7 +156,7 @@ export const idID: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Undangan otomatis',
diff --git a/packages/localizations/src/is-IS.ts b/packages/localizations/src/is-IS.ts
index 63c9e14db9a..d196adcea7d 100644
--- a/packages/localizations/src/is-IS.ts
+++ b/packages/localizations/src/is-IS.ts
@@ -156,7 +156,7 @@ export const isIS: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Sjálfvirk boð',
diff --git a/packages/localizations/src/it-IT.ts b/packages/localizations/src/it-IT.ts
index ce8bae6a8cc..c66749476f2 100644
--- a/packages/localizations/src/it-IT.ts
+++ b/packages/localizations/src/it-IT.ts
@@ -157,7 +157,7 @@ export const itIT: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Inviti automatici',
diff --git a/packages/localizations/src/ja-JP.ts b/packages/localizations/src/ja-JP.ts
index 49296a235c1..fd0cae2ab72 100644
--- a/packages/localizations/src/ja-JP.ts
+++ b/packages/localizations/src/ja-JP.ts
@@ -156,7 +156,7 @@ export const jaJP: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: '自動招待',
diff --git a/packages/localizations/src/ko-KR.ts b/packages/localizations/src/ko-KR.ts
index 9489265eb67..5e472f04426 100644
--- a/packages/localizations/src/ko-KR.ts
+++ b/packages/localizations/src/ko-KR.ts
@@ -156,7 +156,7 @@ export const koKR: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatic invitations',
diff --git a/packages/localizations/src/mn-MN.ts b/packages/localizations/src/mn-MN.ts
index 2fd9226d0e9..1ccfb4a3732 100644
--- a/packages/localizations/src/mn-MN.ts
+++ b/packages/localizations/src/mn-MN.ts
@@ -156,7 +156,7 @@ export const mnMN: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Автомат урилга',
diff --git a/packages/localizations/src/nb-NO.ts b/packages/localizations/src/nb-NO.ts
index 00363d52da0..46df37740e6 100644
--- a/packages/localizations/src/nb-NO.ts
+++ b/packages/localizations/src/nb-NO.ts
@@ -156,7 +156,7 @@ export const nbNO: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatisk invitasjon',
diff --git a/packages/localizations/src/nl-BE.ts b/packages/localizations/src/nl-BE.ts
index e97e4a33105..ac7fb69d83e 100644
--- a/packages/localizations/src/nl-BE.ts
+++ b/packages/localizations/src/nl-BE.ts
@@ -155,7 +155,7 @@ export const nlBE: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatische Uitnodiging',
diff --git a/packages/localizations/src/nl-NL.ts b/packages/localizations/src/nl-NL.ts
index b6701f2b4bb..e7a340ec23d 100644
--- a/packages/localizations/src/nl-NL.ts
+++ b/packages/localizations/src/nl-NL.ts
@@ -155,7 +155,7 @@ export const nlNL: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatische Uitnodiging',
diff --git a/packages/localizations/src/pl-PL.ts b/packages/localizations/src/pl-PL.ts
index bd8599c9d1b..5e0525d0973 100644
--- a/packages/localizations/src/pl-PL.ts
+++ b/packages/localizations/src/pl-PL.ts
@@ -156,7 +156,7 @@ export const plPL: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatyczne zaproszenia',
diff --git a/packages/localizations/src/pt-BR.ts b/packages/localizations/src/pt-BR.ts
index ac407f7316c..a89e942b086 100644
--- a/packages/localizations/src/pt-BR.ts
+++ b/packages/localizations/src/pt-BR.ts
@@ -156,7 +156,7 @@ export const ptBR: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Convites automáticos',
diff --git a/packages/localizations/src/pt-PT.ts b/packages/localizations/src/pt-PT.ts
index 81013c86940..2e7b0b5df67 100644
--- a/packages/localizations/src/pt-PT.ts
+++ b/packages/localizations/src/pt-PT.ts
@@ -155,7 +155,7 @@ export const ptPT: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Convites automáticos',
diff --git a/packages/localizations/src/ro-RO.ts b/packages/localizations/src/ro-RO.ts
index 6e0a1cf89f0..a710f9f2f99 100644
--- a/packages/localizations/src/ro-RO.ts
+++ b/packages/localizations/src/ro-RO.ts
@@ -157,7 +157,7 @@ export const roRO: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Invitații automate',
diff --git a/packages/localizations/src/ru-RU.ts b/packages/localizations/src/ru-RU.ts
index d15d249c13b..cf4e9e57e1a 100644
--- a/packages/localizations/src/ru-RU.ts
+++ b/packages/localizations/src/ru-RU.ts
@@ -159,7 +159,7 @@ export const ruRU: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Автоматические приглашения',
diff --git a/packages/localizations/src/sk-SK.ts b/packages/localizations/src/sk-SK.ts
index 6affff10daf..f1181da575c 100644
--- a/packages/localizations/src/sk-SK.ts
+++ b/packages/localizations/src/sk-SK.ts
@@ -156,7 +156,7 @@ export const skSK: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatic invitations',
diff --git a/packages/localizations/src/sr-RS.ts b/packages/localizations/src/sr-RS.ts
index c4a5aaae6bb..79c06b4ffa4 100644
--- a/packages/localizations/src/sr-RS.ts
+++ b/packages/localizations/src/sr-RS.ts
@@ -155,7 +155,7 @@ export const srRS: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatske pozivnice',
diff --git a/packages/localizations/src/sv-SE.ts b/packages/localizations/src/sv-SE.ts
index be2c69a4167..0a1936e0a47 100644
--- a/packages/localizations/src/sv-SE.ts
+++ b/packages/localizations/src/sv-SE.ts
@@ -156,7 +156,7 @@ export const svSE: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatiska inbjudningar',
diff --git a/packages/localizations/src/th-TH.ts b/packages/localizations/src/th-TH.ts
index 248648a8f87..457df4c8912 100644
--- a/packages/localizations/src/th-TH.ts
+++ b/packages/localizations/src/th-TH.ts
@@ -155,7 +155,7 @@ export const thTH: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'คำเชิญอัตโนมัติ',
diff --git a/packages/localizations/src/tr-TR.ts b/packages/localizations/src/tr-TR.ts
index acddcfcb9a0..d089e2f0a39 100644
--- a/packages/localizations/src/tr-TR.ts
+++ b/packages/localizations/src/tr-TR.ts
@@ -155,7 +155,7 @@ export const trTR: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Otomatik davetler',
diff --git a/packages/localizations/src/uk-UA.ts b/packages/localizations/src/uk-UA.ts
index df8c4971239..41b04555b9f 100644
--- a/packages/localizations/src/uk-UA.ts
+++ b/packages/localizations/src/uk-UA.ts
@@ -156,7 +156,7 @@ export const ukUA: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatic invitations',
diff --git a/packages/localizations/src/vi-VN.ts b/packages/localizations/src/vi-VN.ts
index 313c1d7d04d..f9ba593ee75 100644
--- a/packages/localizations/src/vi-VN.ts
+++ b/packages/localizations/src/vi-VN.ts
@@ -156,7 +156,7 @@ export const viVN: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: 'Automatic invitations',
diff --git a/packages/localizations/src/zh-CN.ts b/packages/localizations/src/zh-CN.ts
index 5920f663192..49d7fd4c93f 100644
--- a/packages/localizations/src/zh-CN.ts
+++ b/packages/localizations/src/zh-CN.ts
@@ -154,7 +154,7 @@ export const zhCN: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: '自动邀请',
diff --git a/packages/localizations/src/zh-TW.ts b/packages/localizations/src/zh-TW.ts
index 2fe932581ab..f6a2658d9dd 100644
--- a/packages/localizations/src/zh-TW.ts
+++ b/packages/localizations/src/zh-TW.ts
@@ -154,7 +154,7 @@ export const zhTW: LocalizationResource = {
   organizationProfile: {
     billingPage: {
       alerts: {
-        noPemissionsToManageBilling: undefined,
+        noPermissionsToManageBilling: undefined,
       },
     },
     badge__automaticInvitation: '自動邀請',
diff --git a/packages/types/src/elementIds.ts b/packages/types/src/elementIds.ts
index 632e2b6b0f7..c5cf21acb76 100644
--- a/packages/types/src/elementIds.ts
+++ b/packages/types/src/elementIds.ts
@@ -39,6 +39,7 @@ export type ProfileSectionId =
   | 'organizationDanger'
   | 'organizationDomains'
   | 'manageVerifiedDomains'
+  | 'subscriptionsList'
   | 'paymentSources';
 export type ProfilePageId = 'account' | 'security' | 'organizationGeneral' | 'organizationMembers' | 'billing';
 
diff --git a/packages/types/src/localization.ts b/packages/types/src/localization.ts
index 3e46585c5ef..978fc279687 100644
--- a/packages/types/src/localization.ts
+++ b/packages/types/src/localization.ts
@@ -696,6 +696,10 @@ type _LocalizationResource = {
         headerTitle__subscriptions: LocalizationValue;
         headerTitle__invoices: LocalizationValue;
       };
+      subscriptionsListSection: {
+        title: LocalizationValue;
+        actionLabel__switchPlan: LocalizationValue;
+      };
       paymentSourcesSection: {
         title: LocalizationValue;
         add: LocalizationValue;
@@ -880,8 +884,38 @@ type _LocalizationResource = {
       };
     };
     billingPage: {
+      title: LocalizationValue;
+      start: {
+        headerTitle__plans: LocalizationValue;
+        headerTitle__subscriptions: LocalizationValue;
+        headerTitle__invoices: LocalizationValue;
+      };
+      subscriptionsListSection: {
+        title: LocalizationValue;
+        actionLabel__switchPlan: LocalizationValue;
+      };
+      paymentSourcesSection: {
+        title: LocalizationValue;
+        add: LocalizationValue;
+        addSubtitle: LocalizationValue;
+        cancelButton: LocalizationValue;
+        actionLabel__default: LocalizationValue;
+        actionLabel__remove: LocalizationValue;
+        formButtonPrimary__add: LocalizationValue;
+        formButtonPrimary__pay: LocalizationValue;
+        removeResource: {
+          title: LocalizationValue;
+          messageLine1: LocalizationValue;
+          messageLine2: LocalizationValue;
+          successMessage: LocalizationValue;
+        };
+        payWithTestCardButton: LocalizationValue;
+      };
+      subscriptionsSection: {
+        actionLabel__default: LocalizationValue;
+      };
       alerts: {
-        noPemissionsToManageBilling: LocalizationValue;
+        noPermissionsToManageBilling: LocalizationValue;
       };
     };
   };