diff --git a/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderButton.tsx b/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderButton.tsx
index 9da8049b..d9aada06 100644
--- a/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderButton.tsx
+++ b/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderButton.tsx
@@ -7,6 +7,8 @@
 import { Text, Tooltip } from "@webpack/common";
 import type { ComponentProps } from "react";
 
+import { buttonRef } from "./BuilderColorButton";
+
 export interface BuilderButtonProps {
     label?: string | undefined;
     tooltip?: string | undefined;
@@ -32,6 +34,7 @@ export const BuilderButton = ({ label, tooltip, selectedStyle, buttonProps }: Bu
                         borderRadius: "4px",
                         cursor: "pointer"
                     }}
+                    ref={buttonRef}
                 >
                     {!selectedStyle && (
                         <svg
diff --git a/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderColorButton.tsx b/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderColorButton.tsx
index e29357a5..43f38e17 100644
--- a/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderColorButton.tsx
+++ b/src/equicordplugins/fakeProfileThemesAndEffects/components/BuilderColorButton.tsx
@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: GPL-3.0-or-later
  */
 
-import { Popout } from "@webpack/common";
+import { Popout, useRef } from "@webpack/common";
 
 import { BuilderButton, type BuilderButtonProps, CustomColorPicker, type CustomColorPickerProps } from ".";
 
@@ -13,9 +13,12 @@ export interface BuilderColorButtonProps extends Pick<BuilderButtonProps, "label
     setColor: (color: number | null) => void;
 }
 
+export const buttonRef = useRef(null);
+
 export const BuilderColorButton = ({ label, color, setColor, suggestedColors }: BuilderColorButtonProps) => (
     <Popout
         position="bottom"
+        targetElementRef={buttonRef}
         renderPopout={() => (
             <CustomColorPicker
                 value={color}
diff --git a/src/equicordplugins/holyNotes/components/modals/NoteBookTab.tsx b/src/equicordplugins/holyNotes/components/modals/NoteBookTab.tsx
index f1c62dad..4dbdee51 100644
--- a/src/equicordplugins/holyNotes/components/modals/NoteBookTab.tsx
+++ b/src/equicordplugins/holyNotes/components/modals/NoteBookTab.tsx
@@ -6,7 +6,7 @@
 
 import { classes } from "@utils/misc";
 import { findByCode } from "@webpack";
-import { Button, Clickable, Menu, Popout, React } from "@webpack/common";
+import { Button, Clickable, Menu, Popout, React, useRef } from "@webpack/common";
 
 import { SvgOverFlowIcon } from "../icons/overFlowIcon";
 
@@ -101,6 +101,8 @@ export function NoteBookTabs({ tabs, selectedTabId, onSelectTab }: { tabs: strin
         );
     }, [tabs, selectedTabId, onSelectTab, overflowedTabs]);
 
+    const buttonRef = useRef(null);
+
     return (
         <div
             className={classes("vc-notebook-tabbar")}
@@ -137,9 +139,11 @@ export function NoteBookTabs({ tabs, selectedTabId, onSelectTab }: { tabs: strin
                     position="bottom"
                     align="right"
                     spacing={0}
+                    targetElementRef={buttonRef}
                 >
                     {props => (
                         <Button
+                            ref={buttonRef}
                             {...props}
                             className={"vc-notebook-overflow-chevron"}
                             size={Button.Sizes.ICON}