diff --git a/src/modules/reader/components/overlay/progress-bar/variants/MobileReaderProgressBar.tsx b/src/modules/reader/components/overlay/progress-bar/variants/MobileReaderProgressBar.tsx
index 8c6574a7..4333a47d 100644
--- a/src/modules/reader/components/overlay/progress-bar/variants/MobileReaderProgressBar.tsx
+++ b/src/modules/reader/components/overlay/progress-bar/variants/MobileReaderProgressBar.tsx
@@ -50,6 +50,10 @@ const BaseMobileReaderProgressBar = ({
         return () => setIsMaximized(false);
     }, [isVisible]);
 
+    if (!isVisible) {
+        return null;
+    }
+
     return (
         <ReaderProgressBarDirectionWrapper>
             <Stack
diff --git a/src/modules/reader/components/overlay/progress-bar/variants/StandardReaderProgressBar.tsx b/src/modules/reader/components/overlay/progress-bar/variants/StandardReaderProgressBar.tsx
index b17cd1c2..8941af7b 100644
--- a/src/modules/reader/components/overlay/progress-bar/variants/StandardReaderProgressBar.tsx
+++ b/src/modules/reader/components/overlay/progress-bar/variants/StandardReaderProgressBar.tsx
@@ -52,6 +52,10 @@ const BaseStandardReaderProgressBar = ({
     const isHidden = progressBarType === ProgressBarType.HIDDEN;
     const isMinimized = !isMaximized && !isDragging;
 
+    if (isHidden) {
+        return null;
+    }
+
     // the progress bar uses the reading direction to set the themes direction, thus, stuff has to be adjusted to still be correctly positioned
     // depending on which combination of theme direction and reading direction is currently active
     return (