## Introduction
**ReactUse** is a comprehensive collection of **100+ essential React Hooks** for building modern React applications. Inspired by [VueUse](https://vueuse.org/), it provides production-ready hooks for browser APIs, state management, sensors, animations, DOM elements, and more.
### Features
- π― **100+ Hooks** β The most comprehensive React hooks collection
- π¦ **Tree-Shakable** β Import only what you need
- π· **TypeScript** β Full type definitions for every hook
- π₯οΈ **SSR Compatible** β Works with Next.js, Remix, and more
- π **Well Documented** β Interactive demos for every hook
- π€ **MCP Support** β AI-powered hook discovery
### Installation
```bash
npm i @reactuses/core
```
### Quick Start
```tsx
import { useToggle } from "@reactuses/core";
const Demo = () => {
const [on, toggle] = useToggle(true);
return ;
};
```
---
## Hook Categories
Browser (48 hooks)
useClipboard, useColorMode, useCookie, useDarkMode, useDocumentVisibility, useEyeDropper, useFavicon, useFileDialog, useFullscreen, useMediaDevices, useMediaQuery, useOnline, usePermission, usePlatform, usePreferredColorScheme, usePreferredContrast, usePreferredDark, usePreferredLanguages, useScreenSafeArea, useScriptTag, useTextDirection, useTitle, useWebNotification, useBroadcastChannel, useEventSource, useFetchEventSource, useGeolocation, useIdle, useKeyModifier, useMobileLandscape, useNetwork, useOrientation, usePageLeave, useSpeechRecognition, useWindowFocus, useWindowScroll, useWindowSize, and more...
State (24 hooks)
useBoolean, useControlled, useCounter, useCycleList, useDebounce, useDebounceFn, useDisclosure, useLocalStorage, useMap, usePrevious, useSessionStorage, useSetState, useThrottle, useThrottleFn, useToggle, and more...
Element (19 hooks)
useClickOutside, useDraggable, useDropZone, useElementBounding, useElementByPoint, useElementSize, useElementVisibility, useFocus, useHover, useInfiniteScroll, useIntersectionObserver, useLongPress, useMeasure, useMouse, useMousePressed, useMutationObserver, useResizeObserver, useScroll, useScrollIntoView, and more...
Effect (20 hooks)
useAsyncEffect, useCustomCompareEffect, useDeepCompareEffect, useEventListener, useInterval, useMount, useRafFn, useTimeout, useTimeoutFn, useUnmount, useUpdate, and more...
---
## Who's Using This
[](https://www.pinduoduo.com/)
[](https://shopee.com/)
[](https://www.ctrip.com/)
[](https://bambulab.com/)
---
## MCP Support
If you want to use the MCP (Model Context Protocol) integration with reactuse, you can easily set it up with the following configuration. This allows you to run the `@reactuses/mcp` utility via `npx` for enhanced command-line support and automation.
Add the following to your configuration:
```json
"@reactuses/mcp": {
"command": "npx",
"args": ["-y", "@reactuses/mcp@latest"],
"type": "stdio"
}
```
---
## Documentation
π [Full Documentation](https://reactuse.com) | π¬ [Discord](https://discord.gg/VEMFdByJ) | π [Issues](https://github.com/childrentime/reactuse/issues)
---
## Thanks
This project is heavily inspired by the following awesome projects.
- [streamich/react-use](https://github.com/streamich/react-use)
- [ahooks](https://github.com/alibaba/hooks)
- [vueuse](https://github.com/vueuse/vueuse)
---
## Sponsor Me
If my work has helped you, consider buying me a cup of coffee. Thank you very muchπ₯°!.
[Buy me a coffee](https://www.buymeacoffee.com/lianwenwu)
