diff --git a/packages/excalidraw/components/ColorPicker/ColorPicker.tsx b/packages/excalidraw/components/ColorPicker/ColorPicker.tsx
index 336906a4b7..6fd99dd468 100644
--- a/packages/excalidraw/components/ColorPicker/ColorPicker.tsx
+++ b/packages/excalidraw/components/ColorPicker/ColorPicker.tsx
@@ -106,7 +106,7 @@ const ColorPickerPopupContent = ({
   return (
     <PropertiesPopover
       container={container}
-      style={{ maxWidth: "208px" }}
+      style={{ maxWidth: "13rem" }}
       onFocusOutside={(event) => {
         // refocus due to eye dropper
         focusPickerContent();
diff --git a/packages/excalidraw/css/styles.scss b/packages/excalidraw/css/styles.scss
index f0c4c5d093..673106700e 100644
--- a/packages/excalidraw/css/styles.scss
+++ b/packages/excalidraw/css/styles.scss
@@ -387,7 +387,7 @@ body.excalidraw-cursor-resize * {
   .App-menu__left {
     overflow-y: auto;
     padding: 0.75rem;
-    width: 200px;
+    width: 12.5rem;
     box-sizing: border-box;
     position: absolute;
   }