diff --git a/src/MainLayout.tsx b/src/MainLayout.tsx
index 83698af..c105e44 100644
--- a/src/MainLayout.tsx
+++ b/src/MainLayout.tsx
@@ -62,7 +62,8 @@ function ThemeButton() {
         </Button>
       </PopoverTrigger>
       <PopoverContent
-        anchor="bottomLeft"
+        anchor={"end"}
+        align={"end"}
         className="w-32"
       >
         <Button
diff --git a/src/docs/components/PopoverBlocks/Examples/ThemeSelector.tsx b/src/docs/components/PopoverBlocks/Examples/ThemeSelector.tsx
index 1111f09..8163c76 100644
--- a/src/docs/components/PopoverBlocks/Examples/ThemeSelector.tsx
+++ b/src/docs/components/PopoverBlocks/Examples/ThemeSelector.tsx
@@ -51,7 +51,12 @@ export const ThemeSelector = () => {
           {theme === "light" ? <LightIcon /> : <DarkIcon />}
         </Button>
       </PopoverTrigger>
-      <PopoverContent anchor={"bottomCenter"}>
+      <PopoverContent
+        direction={"col"}
+        position={"end"}
+        anchor={"middle"}
+        align={"middle"}
+      >
         <Button
           onClick={() => setTheme("dark")}
           preset={"ghost"}
diff --git a/src/docs/components/PopoverBlocks/Examples/UserControl.tsx b/src/docs/components/PopoverBlocks/Examples/UserControl.tsx
index c070658..e6c3b6c 100644
--- a/src/docs/components/PopoverBlocks/Examples/UserControl.tsx
+++ b/src/docs/components/PopoverBlocks/Examples/UserControl.tsx
@@ -77,7 +77,8 @@ const SignInForm = () => {
 
   return (
     <PopoverContent
-      anchor={"bottomLeft"}
+      anchor={"end"}
+      align={"end"}
       className={"p-4 space-y-3"}
     >
       <Label>
@@ -127,7 +128,10 @@ const UserControlContent = () => {
   }
 
   return (
-    <PopoverContent anchor={"bottomLeft"}>
+    <PopoverContent
+      anchor={"end"}
+      align={"end"}
+    >
       <Button preset={"ghost"}>Dashboard</Button>
       <Button
         preset={"ghost"}