diff --git a/docs/src/docs/hooks/use-color-scheme.mdx b/docs/src/docs/hooks/use-color-scheme.mdx
index 0b55abfb2cc..63bb53525f7 100644
--- a/docs/src/docs/hooks/use-color-scheme.mdx
+++ b/docs/src/docs/hooks/use-color-scheme.mdx
@@ -21,4 +21,10 @@ use-color-scheme returns color scheme value i.e. either `dark` or `light`:
 
 Hook uses [use-media-query](/hooks/use-media-query/) hook under the hood.
 Hook relies on `window.matchMedia()` [API](https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia)
-and will always return `light` if the api is not available (e.g. during server side rendering).
+and will always return `light` if the api is not available (e.g. during server side rendering) unless initial value is provided in first argument.
+
+## Definition
+
+```tsx
+function useColorScheme(initialValue?: 'dark' | 'light'): 'dark' | 'light';
+```
diff --git a/docs/src/docs/hooks/use-media-query.mdx b/docs/src/docs/hooks/use-media-query.mdx
index c6c38f31e34..170e53bb95f 100644
--- a/docs/src/docs/hooks/use-media-query.mdx
+++ b/docs/src/docs/hooks/use-media-query.mdx
@@ -16,22 +16,21 @@ import { HooksDemos } from '@mantine/demos';
 ## Usage
 
 use-media-query hook allows to subscribe to media queries.
-It receives media query as an argument and returns true
-if given media query matches current state.
+It receives media query as an argument and returns true if given media query matches current state.
 Hook relies on `window.matchMedia()` [API](https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia)
-and will return false if api is not available.
+and will return false if api is not available unless initial value is provided in the second argument.
 
-Hook takes media query as first argument and returns true if query is satisfied.
 Resize browser window to trigger `window.matchMedia` event:
 
 <Demo data={HooksDemos.useMediaQueryDemo} />
 
 ## Server Side Rendering
-When rendering a component on the server that uses useMediaQuery, it is important to pass the second argument `initialValue` because without it the server may generate html that the React client cannot correctly hydrate. 
-See the [React docs](https://reactjs.org/docs/react-dom.html#hydrate) for more on why this is can lead to costly bugs.
+
+When rendering a component on the server that uses useMediaQuery, it is important to pass the second argument `initialValue`,
+without it the server may generate html that cannot be correctly hydrated on client.
 
 For example, the server will generate the html for clients using a smaller device.
-After the React client hydrates this, the hook will render again and return the result of the media query:
+After the hydration, the hook will render again and return the result of the media query:
 
 ```tsx
 import { Badge } from '@mantine/core';
@@ -46,4 +45,10 @@ function Demo() {
     </Badge>
   );
 }`
-```
\ No newline at end of file
+```
+
+## Definition
+
+```tsx
+function useMediaQuery(query: string, initialValue?: boolean): boolean;
+```
diff --git a/docs/src/docs/hooks/use-reduced-motion.mdx b/docs/src/docs/hooks/use-reduced-motion.mdx
index 70cc4a8eee5..54ab240abe6 100644
--- a/docs/src/docs/hooks/use-reduced-motion.mdx
+++ b/docs/src/docs/hooks/use-reduced-motion.mdx
@@ -18,9 +18,15 @@ import { HooksDemos } from '@mantine/demos';
 use-reduced-motion detects if user [prefers to reduce motion](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion).
 It uses [use-media-query](/hooks/use-media-query/) hook under the hood.
 Hook relies on `window.matchMedia()` [API](https://developer.mozilla.org/en-US/docs/Web/API/Window/matchMedia)
-and will always return false if api is not available (e.g. during server side rendering).
+and will always return false if api is not available (e.g. during server side rendering), unless initial value is provided in the first argument.
 
 Use hook to detect if user prefers to reduce motion (`(prefers-reduced-motion: reduce)` media query) and set animations duration based on this value.
 All Mantine components which use animations support it by default:
 
 <Demo data={HooksDemos.useReducedMotionDemo} />
+
+## Definition
+
+```tsx
+function useReducedMotion(initialValue?: boolean): boolean;
+```
diff --git a/src/mantine-hooks/src/use-color-scheme/use-color-scheme.ts b/src/mantine-hooks/src/use-color-scheme/use-color-scheme.ts
index e4093c2bd88..c4eba529eff 100644
--- a/src/mantine-hooks/src/use-color-scheme/use-color-scheme.ts
+++ b/src/mantine-hooks/src/use-color-scheme/use-color-scheme.ts
@@ -1,5 +1,5 @@
 import { useMediaQuery } from '../use-media-query/use-media-query';
 
-export function useColorScheme() {
-  return useMediaQuery('(prefers-color-scheme: dark)') ? 'dark' : 'light';
+export function useColorScheme(initialValue?: 'dark' | 'light') {
+  return useMediaQuery('(prefers-color-scheme: dark)', initialValue === 'dark') ? 'dark' : 'light';
 }
diff --git a/src/mantine-hooks/src/use-media-query/use-media-query.ts b/src/mantine-hooks/src/use-media-query/use-media-query.ts
index e1379fa28f2..41a1c9508b6 100644
--- a/src/mantine-hooks/src/use-media-query/use-media-query.ts
+++ b/src/mantine-hooks/src/use-media-query/use-media-query.ts
@@ -25,11 +25,6 @@ function getInitialValue(query: string, initialValue?: boolean) {
     return window.matchMedia(query).matches;
   }
 
-  // eslint-disable-next-line no-console
-  console.error(
-    '[@mantine/hooks] use-media-query: Please provide a default value when using server side rendering to prevent a hydration mismatch.'
-  );
-
   return false;
 }
 
@@ -37,13 +32,14 @@ export function useMediaQuery(query: string, initialValue?: boolean) {
   const [matches, setMatches] = useState(getInitialValue(query, initialValue));
   const queryRef = useRef<MediaQueryList>();
 
-  // eslint-disable-next-line consistent-return
   useEffect(() => {
     if ('matchMedia' in window) {
       queryRef.current = window.matchMedia(query);
       setMatches(queryRef.current.matches);
       return attachMediaListener(queryRef.current, (event) => setMatches(event.matches));
     }
+
+    return undefined;
   }, [query]);
 
   return matches;
diff --git a/src/mantine-hooks/src/use-reduced-motion/use-reduced-motion.ts b/src/mantine-hooks/src/use-reduced-motion/use-reduced-motion.ts
index 83096c3cf02..2195c799f93 100644
--- a/src/mantine-hooks/src/use-reduced-motion/use-reduced-motion.ts
+++ b/src/mantine-hooks/src/use-reduced-motion/use-reduced-motion.ts
@@ -1,5 +1,5 @@
 import { useMediaQuery } from '../use-media-query/use-media-query';
 
-export function useReducedMotion() {
-  return useMediaQuery('(prefers-reduced-motion: reduce)');
+export function useReducedMotion(initialValue?: boolean) {
+  return useMediaQuery('(prefers-reduced-motion: reduce)', initialValue);
 }