diff --git a/src/create.ts b/src/create.ts
index ff6e2d1..554ca5b 100644
--- a/src/create.ts
+++ b/src/create.ts
@@ -2,15 +2,25 @@ import { useMemo, useState } from "react";
 
 import { isBrowser, useIsomorphicEffect } from "./utils";
 
-export function create<TScreens extends Record<string, string>>(screens: TScreens) {
+export function create<TScreens extends Record<string, string | { min?: string; max?: string }>>(screens: TScreens) {
   function useBreakpoint(breakpoint: keyof TScreens, defaultValue: boolean = false) {
     const [match, setMatch] = useState(() => defaultValue);
 
     useIsomorphicEffect(() => {
       if (!(isBrowser && "matchMedia" in window && window.matchMedia)) return undefined;
 
-      const value = screens[breakpoint] ?? "999999px";
-      const query = window.matchMedia(`(min-width: ${value})`);
+      const value = screens[breakpoint];
+      let queryStr = "";
+
+      if (typeof value === "string") {
+        queryStr = `(min-width: ${value})`;
+      } else if (typeof value === "object") {
+        const { min, max } = value;
+        if (min) queryStr += `(min-width: ${min})`;
+        if (max) queryStr += `${min ? " and " : ""}(max-width: ${max})`;
+      }
+
+      const query = window.matchMedia(queryStr);
 
       function listener(event: MediaQueryListEvent) {
         setMatch(event.matches);