diff --git a/src/utility/usePrefersReducedMotion.ts b/src/utility/usePrefersReducedMotion.ts
index 7f8e70cf..65a7b30f 100644
--- a/src/utility/usePrefersReducedMotion.ts
+++ b/src/utility/usePrefersReducedMotion.ts
@@ -3,20 +3,24 @@ import { useEffect, useState } from 'react';
 const MEDIA_QUERY_SELECTOR = '(prefers-reduced-motion: reduce)';
 const MEDIA_QUERY_EVENT = 'change';
 
+const safelyGetMediaQuery = () => typeof window !== 'undefined'
+  ? window.matchMedia(MEDIA_QUERY_SELECTOR)
+  : undefined;
+
 const usePrefersReducedMotion = () => {
-  const [prefersReducedMotion, setPrefersReducedMotion] = useState(
-    window.matchMedia(MEDIA_QUERY_SELECTOR).matches
+  const [prefersReducedMotion, setPrefersReducedMotion] = useState<boolean>(
+    safelyGetMediaQuery()?.matches ?? false
   );
 
   useEffect(() => {
-    const mediaQuery = window.matchMedia(MEDIA_QUERY_SELECTOR);
+    const mediaQuery = safelyGetMediaQuery();
 
     const listener = () => {
-      setPrefersReducedMotion(mediaQuery.matches);
+      setPrefersReducedMotion(mediaQuery?.matches ?? false);
     };
 
-    mediaQuery.addEventListener(MEDIA_QUERY_EVENT, listener);
-    return () => mediaQuery.removeEventListener(MEDIA_QUERY_EVENT, listener);
+    mediaQuery?.addEventListener(MEDIA_QUERY_EVENT, listener);
+    return () => mediaQuery?.removeEventListener(MEDIA_QUERY_EVENT, listener);
   }, []);
 
   return prefersReducedMotion;