diff --git a/.playwright/snapshots/components/SelectPanel.test.ts-snapshots/SelectPanel-Default-forced-colors-dark-linux.png b/.playwright/snapshots/components/SelectPanel.test.ts-snapshots/SelectPanel-Default-forced-colors-dark-linux.png
index 8864c514386..7912e84b4b6 100644
Binary files a/.playwright/snapshots/components/SelectPanel.test.ts-snapshots/SelectPanel-Default-forced-colors-dark-linux.png and b/.playwright/snapshots/components/SelectPanel.test.ts-snapshots/SelectPanel-Default-forced-colors-dark-linux.png differ
diff --git a/packages/react/src/TreeView/TreeViewWithLeadingAction.stories.module.css b/packages/react/src/TreeView/TreeViewWithLeadingAction.stories.module.css
new file mode 100644
index 00000000000..31c7c55e4cb
--- /dev/null
+++ b/packages/react/src/TreeView/TreeViewWithLeadingAction.stories.module.css
@@ -0,0 +1,11 @@
+.StoryContainer {
+  max-width: 400px;
+}
+
+.DoneIcon {
+  color: var(--fgColor-done);
+}
+
+.OpenIcon {
+  color: var(--fgColor-open);
+}
diff --git a/packages/react/src/TreeView/TreeViewWithLeadingAction.stories.tsx b/packages/react/src/TreeView/TreeViewWithLeadingAction.stories.tsx
index fd6c644395e..1e60f9acb5d 100644
--- a/packages/react/src/TreeView/TreeViewWithLeadingAction.stories.tsx
+++ b/packages/react/src/TreeView/TreeViewWithLeadingAction.stories.tsx
@@ -1,11 +1,11 @@
 import {GrabberIcon, IssueClosedIcon, IssueOpenedIcon} from '@primer/octicons-react'
 import type {Meta, StoryFn} from '@storybook/react-vite'
-import Box from '../Box'
 import Link from '../Link'
 import {Banner} from '../Banner'
 import {IconButton} from '../Button'
 import Octicon from '../Octicon'
 import {TreeView} from './TreeView'
+import classes from './TreeViewWithLeadingAction.stories.module.css'
 
 const meta: Meta = {
   title: 'Private/Components/TreeViewWithLeadingAction',
@@ -13,9 +13,9 @@ const meta: Meta = {
   decorators: [
     Story => {
       return (
-        <Box sx={{maxWidth: 400}}>
+        <div className={classes.StoryContainer}>
           <Story />
-        </Box>
+        </div>
       )
     },
   ],
@@ -23,7 +23,7 @@ const meta: Meta = {
 
 export const LeadingAction: StoryFn = () => {
   return (
-    <Box>
+    <div>
       <Banner
         title="High-risk feature"
         description={
@@ -43,7 +43,7 @@ export const LeadingAction: StoryFn = () => {
             <IconButton icon={GrabberIcon} aria-label="Reorder item 1" variant="invisible" />
           </TreeView.LeadingAction>
           <TreeView.LeadingVisual label="Issue closed">
-            <Octicon icon={IssueClosedIcon} sx={{color: 'done.fg'}} />
+            <Octicon icon={IssueClosedIcon} className={classes.DoneIcon} />
           </TreeView.LeadingVisual>
           Item 1
         </TreeView.Item>
@@ -52,19 +52,19 @@ export const LeadingAction: StoryFn = () => {
             <IconButton icon={GrabberIcon} aria-label="Reorder item 2" variant="invisible" />
           </TreeView.LeadingAction>
           <TreeView.LeadingVisual label="Issue opened">
-            <Octicon icon={IssueOpenedIcon} sx={{color: 'open.fg'}} />
+            <Octicon icon={IssueOpenedIcon} className={classes.OpenIcon} />
           </TreeView.LeadingVisual>
           Item 2
           <TreeView.SubTree>
             <TreeView.Item id="item-2-sub-task-1">
               <TreeView.LeadingVisual label="Issue opened">
-                <Octicon icon={IssueOpenedIcon} sx={{color: 'open.fg'}} />
+                <Octicon icon={IssueOpenedIcon} className={classes.OpenIcon} />
               </TreeView.LeadingVisual>
               sub task 1
             </TreeView.Item>
             <TreeView.Item id="item-2-sub-task-2">
               <TreeView.LeadingVisual label="Issue opened">
-                <Octicon icon={IssueOpenedIcon} sx={{color: 'open.fg'}} />
+                <Octicon icon={IssueOpenedIcon} className={classes.OpenIcon} />
               </TreeView.LeadingVisual>
               sub task 2
             </TreeView.Item>
@@ -75,12 +75,12 @@ export const LeadingAction: StoryFn = () => {
             <IconButton icon={GrabberIcon} aria-label="Reorder item 3" variant="invisible" />
           </TreeView.LeadingAction>
           <TreeView.LeadingVisual label="Issue opened">
-            <Octicon icon={IssueOpenedIcon} sx={{color: 'open.fg'}} />
+            <Octicon icon={IssueOpenedIcon} className={classes.OpenIcon} />
           </TreeView.LeadingVisual>
           Item 3
         </TreeView.Item>
       </TreeView>
-    </Box>
+    </div>
   )
 }