diff --git a/web/components/theme-icon.tsx b/web/components/theme-icon.tsx
index 9015d3bd..a0476bc6 100644
--- a/web/components/theme-icon.tsx
+++ b/web/components/theme-icon.tsx
@@ -31,8 +31,8 @@ export default function ThemeIcon(props: {className?: string}) {
     </>
   )
   return (
-    <button onClick={toggleTheme}>
-      <Row className="items-center gap-1 border-2 border-gray-500 rounded-full p-1 max-w-fit mx-2 px-3 hover:bg-canvas-100">
+    <button onClick={toggleTheme} className={'w-fit'}>
+      <Row className="items-center gap-1 border-2 border-gray-500 rounded-full p-1 w-fit mx-2 px-3 hover:bg-canvas-100">
         {icon}
         {children}
       </Row>