diff --git a/extensions/default/src/customizations/contextMenuUICustomization.ts b/extensions/default/src/customizations/contextMenuUICustomization.ts
index 4366df89c6e..6b941238d9e 100644
--- a/extensions/default/src/customizations/contextMenuUICustomization.ts
+++ b/extensions/default/src/customizations/contextMenuUICustomization.ts
@@ -1,5 +1,5 @@
-import { ContextMenu } from '@ohif/ui';
+import { ContextMenuViewport } from '@ohif/ui-next';
 
 export default {
-  'ui.contextMenu': ContextMenu,
+  'ui.contextMenu': ContextMenuViewport,
 };
diff --git a/platform/ui-next/src/components/ContextMenuViewport/ContextMenuViewport.tsx b/platform/ui-next/src/components/ContextMenuViewport/ContextMenuViewport.tsx
new file mode 100644
index 00000000000..a34831d1582
--- /dev/null
+++ b/platform/ui-next/src/components/ContextMenuViewport/ContextMenuViewport.tsx
@@ -0,0 +1,46 @@
+import React from 'react';
+import { Icons } from '../Icons';
+
+interface ContextMenuViewportProps {
+  items?: Array<{
+    label: string;
+    action: (item: any, props: any) => void;
+    iconRight?: string;
+    [key: string]: unknown;
+  }>;
+  defaultPosition?: { x: number; y: number };
+  [key: string]: unknown;
+}
+
+const ContextMenuViewport = ({ items, ...props }: ContextMenuViewportProps) => {
+  if (!items) {
+    return null;
+  }
+
+  return (
+    <div
+      data-cy="context-menu"
+      className="bg-popover text-popover-foreground animate-in fade-in-0 zoom-in-95 relative z-50 w-48 overflow-hidden rounded-md border border-input p-1 shadow-md"
+      onContextMenu={e => e.preventDefault()}
+    >
+      {items.map((item, index) => (
+        <div
+          key={index}
+          data-cy="context-menu-item"
+          onClick={() => item.action(item, props)}
+          className="hover:bg-accent hover:text-accent-foreground flex cursor-default select-none items-center justify-between rounded-sm px-2 py-1.5 text-base outline-none"
+        >
+          <span>{item.label}</span>
+          {item.iconRight && (
+            <Icons.ByName
+              name={item.iconRight}
+              className="inline"
+            />
+          )}
+        </div>
+      ))}
+    </div>
+  );
+};
+
+export default ContextMenuViewport;
diff --git a/platform/ui-next/src/components/ContextMenuViewport/index.ts b/platform/ui-next/src/components/ContextMenuViewport/index.ts
new file mode 100644
index 00000000000..85f59ff4c8e
--- /dev/null
+++ b/platform/ui-next/src/components/ContextMenuViewport/index.ts
@@ -0,0 +1 @@
+export { default as ContextMenuViewport } from './ContextMenuViewport';
diff --git a/platform/ui-next/src/components/index.ts b/platform/ui-next/src/components/index.ts
index 699d2a14a87..7aa642a90a7 100644
--- a/platform/ui-next/src/components/index.ts
+++ b/platform/ui-next/src/components/index.ts
@@ -129,6 +129,7 @@ import {
 } from './ToolButton';
 import { LayoutSelector } from './LayoutSelector';
 import { ToolSettings } from './OHIFToolSettings';
+import { ContextMenuViewport } from './ContextMenuViewport';
 export { DataRow } from './DataRow';
 export { MeasurementTable } from './MeasurementTable';
 export * from './ColorCircle';
@@ -280,6 +281,7 @@ export {
   ViewportDialog,
   CinePlayer,
   LayoutSelector,
+  ContextMenuViewport,
   SmartScrollbar,
   useSmartScrollbarLayoutContext,
   useSmartScrollbarScrollContext,