diff --git a/apps/nextjs/src/components/board/items/item-select-modal.tsx b/apps/nextjs/src/components/board/items/item-select-modal.tsx
index ee8b05b58..dc50bf300 100644
--- a/apps/nextjs/src/components/board/items/item-select-modal.tsx
+++ b/apps/nextjs/src/components/board/items/item-select-modal.tsx
@@ -70,7 +70,7 @@ export const ItemSelectModal = createModal<void>(({ actions }) => {
   );
 }).withOptions({
   defaultTitle: (t) => t("item.create.title"),
-  size: 1200,
+  size: "xxl",
 });
 
 const WidgetItem = ({
diff --git a/apps/nextjs/src/components/integration/integration-select-modal.tsx b/apps/nextjs/src/components/integration/integration-select-modal.tsx
index c93f1d5de..5e99548cd 100644
--- a/apps/nextjs/src/components/integration/integration-select-modal.tsx
+++ b/apps/nextjs/src/components/integration/integration-select-modal.tsx
@@ -52,5 +52,5 @@ export const IntegrationSelectModal = createModal<IntegrationSelectModalProps>((
   return <IntegrationSelectGrid onSelect={handleSelect} enableMockIntegration={innerProps.enableMockIntegration} />;
 }).withOptions({
   defaultTitle: (t) => t("integration.action.create"),
-  size: 1200,
+  size: "xxl",
 });
diff --git a/packages/modals-collection/src/apps/app-select-modal.tsx b/packages/modals-collection/src/apps/app-select-modal.tsx
index a4f37fcb7..fa00c92a8 100644
--- a/packages/modals-collection/src/apps/app-select-modal.tsx
+++ b/packages/modals-collection/src/apps/app-select-modal.tsx
@@ -151,5 +151,5 @@ export const AppSelectModal = createModal<AppSelectModalProps>(({ actions, inner
   );
 }).withOptions({
   defaultTitle: (t) => t("app.action.select.title"),
-  size: 1200,
+  size: "xxl",
 });
diff --git a/packages/ui/src/theme.ts b/packages/ui/src/theme.ts
index e1e928d57..2d5db6f0d 100644
--- a/packages/ui/src/theme.ts
+++ b/packages/ui/src/theme.ts
@@ -1,4 +1,4 @@
-import { createTheme } from "@mantine/core";
+import { createTheme, Modal } from "@mantine/core";
 
 import { primaryColor } from "./theme/colors/primary";
 import { secondaryColor } from "./theme/colors/secondary";
@@ -9,4 +9,14 @@ export const theme = createTheme({
     secondaryColor,
   },
   primaryColor: "primaryColor",
+  components: {
+    Modal: Modal.extend({
+      vars: (_theme, props) => {
+        if (props.size === "xxl") {
+          return { root: { "--modal-size": "75rem" } };
+        }
+        return { root: {} };
+      },
+    }),
+  },
 });