diff --git a/apps/studio/components/interfaces/Auth/Policies/PolicyEditor/PolicyRoles.tsx b/apps/studio/components/interfaces/Auth/Policies/PolicyEditor/PolicyRoles.tsx
index 42a935d974c..c8373a59039 100644
--- a/apps/studio/components/interfaces/Auth/Policies/PolicyEditor/PolicyRoles.tsx
+++ b/apps/studio/components/interfaces/Auth/Policies/PolicyEditor/PolicyRoles.tsx
@@ -2,7 +2,7 @@ import { SYSTEM_ROLES } from 'components/interfaces/Database/Roles/Roles.constan
 import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
 import AlertError from 'components/ui/AlertError'
 
-import MultiSelect from 'components/ui/MultiSelect'
+import MultiSelect from 'ui-patterns/MultiSelect'
 import ShimmeringLoader from 'components/ui/ShimmeringLoader'
 import { useDatabaseRolesQuery } from 'data/database-roles/database-roles-query'
 import { sortBy } from 'lodash'
diff --git a/apps/studio/components/interfaces/Database/Indexes/CreateIndexSidePanel.tsx b/apps/studio/components/interfaces/Database/Indexes/CreateIndexSidePanel.tsx
index 3a8f270b5fd..712dc412d14 100644
--- a/apps/studio/components/interfaces/Database/Indexes/CreateIndexSidePanel.tsx
+++ b/apps/studio/components/interfaces/Database/Indexes/CreateIndexSidePanel.tsx
@@ -4,7 +4,7 @@ import { Button, Input, Listbox, SidePanel } from 'ui'
 
 import { useProjectContext } from 'components/layouts/ProjectLayout/ProjectContext'
 import { CodeEditor } from 'components/ui/CodeEditor'
-import MultiSelect, { MultiSelectOption } from 'components/ui/MultiSelect'
+import MultiSelect, { MultiSelectOption } from 'ui-patterns/MultiSelect'
 import ShimmeringLoader from 'components/ui/ShimmeringLoader'
 import { useIndexesQuery } from 'data/database/indexes-query'
 import { useSchemasQuery } from 'data/database/schemas-query'
diff --git a/apps/studio/components/interfaces/Settings/API/PostgrestConfig.tsx b/apps/studio/components/interfaces/Settings/API/PostgrestConfig.tsx
index 3be5a200e5d..706d3291012 100644
--- a/apps/studio/components/interfaces/Settings/API/PostgrestConfig.tsx
+++ b/apps/studio/components/interfaces/Settings/API/PostgrestConfig.tsx
@@ -12,7 +12,7 @@ import {
   FormSectionContent,
   FormSectionLabel,
 } from 'components/ui/Forms'
-import MultiSelect from 'components/ui/MultiSelect'
+import MultiSelect from 'ui-patterns/MultiSelect'
 import { useProjectPostgrestConfigQuery } from 'data/config/project-postgrest-config-query'
 import { useProjectPostgrestConfigUpdateMutation } from 'data/config/project-postgrest-config-update-mutation'
 import { useSchemasQuery } from 'data/database/schemas-query'
diff --git a/apps/studio/components/interfaces/Support/SupportForm.tsx b/apps/studio/components/interfaces/Support/SupportForm.tsx
index fad2969fe46..74860bf5ab2 100644
--- a/apps/studio/components/interfaces/Support/SupportForm.tsx
+++ b/apps/studio/components/interfaces/Support/SupportForm.tsx
@@ -22,7 +22,7 @@ import {
 
 import Divider from 'components/ui/Divider'
 import InformationBox from 'components/ui/InformationBox'
-import MultiSelect from 'components/ui/MultiSelect'
+import MultiSelect from 'ui-patterns/MultiSelect'
 import ShimmeringLoader from 'components/ui/ShimmeringLoader'
 import { getProjectAuthConfig } from 'data/auth/auth-config-query'
 import { useSendSupportTicketMutation } from 'data/feedback/support-ticket-send'
diff --git a/apps/studio/components/ui/MultiSelect/Badges.tsx b/packages/ui-patterns/MultiSelect/Badges.tsx
similarity index 100%
rename from apps/studio/components/ui/MultiSelect/Badges.tsx
rename to packages/ui-patterns/MultiSelect/Badges.tsx
diff --git a/apps/studio/components/ui/MultiSelect/index.tsx b/packages/ui-patterns/MultiSelect/index.tsx
similarity index 100%
rename from apps/studio/components/ui/MultiSelect/index.tsx
rename to packages/ui-patterns/MultiSelect/index.tsx