diff --git a/code/ui/components/src/tabs/tabs.stories.tsx b/code/ui/components/src/tabs/tabs.stories.tsx
index d4412c56715f..02a2927d5373 100644
--- a/code/ui/components/src/tabs/tabs.stories.tsx
+++ b/code/ui/components/src/tabs/tabs.stories.tsx
@@ -191,12 +191,23 @@ export const StatefulStaticWithSetBackgroundColor = {
   ),
 } satisfies Story;
 
+const customViewports = {
+  chromatic: {
+    name: 'Chromatic',
+    styles: {
+      width: '380px',
+      height: '963px',
+    },
+  },
+};
+
 export const StatefulDynamicWithOpenTooltip = {
   parameters: {
     viewport: {
-      defaultViewport: 'mobile2',
+      defaultViewport: 'chromatic',
+      viewports: customViewports,
     },
-    chromatic: { viewports: [414] },
+    chromatic: { viewports: [380] },
   },
   play: async ({ canvasElement }) => {
     const canvas = within(canvasElement);
@@ -228,9 +239,10 @@ export const StatefulDynamicWithOpenTooltip = {
 export const StatefulDynamicWithSelectedAddon = {
   parameters: {
     viewport: {
-      defaultViewport: 'mobile2',
+      defaultViewport: 'chromatic',
+      viewports: customViewports,
     },
-    chromatic: { viewports: [414] },
+    chromatic: { viewports: [380] },
   },
   play: async (context) => {
     await StatefulDynamicWithOpenTooltip.play(context);