Leave Yamada UI a star
Search the docs
Convenient custom hooks are provided in Yamada UI to help you build your projects more quickly.
useAnimation is a custom hook that implements animations similar to CSS keyframes.
useAnimation
keyframes
useAsync is a custom hook that executes an asynchronous function and tracks its state.
useAsync
useAsyncCallback is a custom hook for managing asynchronous callbacks.
useAsyncCallback
useBoolean is a custom hook used to manage boolean values using on, off, and toggle functions.
useBoolean
on
off
toggle
useBreakpoint is a custom hook that returns the current breakpoint. This hook monitors changes in the window size and returns the appropriate value.
useBreakpoint
useBreakpointEffect is a custom hook that executes a specific callback function when the breakpoint changes.
useBreakpointEffect
useBreakpointState is a custom hook that takes a responsive object as an initial state and returns a state corresponding to the current breakpoint.
useBreakpointState
useBreakpointValue is a custom hook that returns the value of the current breakpoint from the provided object. This hook monitors changes in the window size and returns the appropriate value.
useBreakpointValue
useClipboard is a custom hook that performs the operation of copying a value to the clipboard.
useClipboard
useColorMode is a custom hook that returns the current color mode.
useColorMode
useColorModeValue is a custom hook that returns the value of the current color mode from the provided values.
useColorModeValue
useDisclosure is a custom hook that helps handle common open/close or toggle scenarios. It can be used to control components such as Modal, Dialog, Drawer, etc.
useDisclosure
Modal
Dialog
Drawer
useDynamicAnimation is a custom hook used to switch animations.
useDynamicAnimation
useFormatByte is a custom hook for formatting bytes.
useFormatByte
useFormatNumber is a custom hook for formatting numbers.
useFormatNumber
useHover is a custom hook that detects whether the pointer has moved over or away from an element.
useHover
useIdle is a custom hook that detects whether the user has been idle for a certain amount of time in milliseconds.
useIdle
useInfiniteScroll is a custom hook that provides infinite scroll functionality.
useInfiniteScroll
useInterval is a custom hook that runs a function at a specified interval.
useInterval
useLoading is a custom hook for controlling the loading of the application.
useLoading
useLocalStorage is a custom hook for storing, updating, and retrieving values in local storage.
useLocalStorage
useMediaQuery is a custom hook that detects whether it matches a single or multiple media queries.
useMediaQuery
useNotice is a custom hook that controls the notifications of the application.
useNotice
useOS is a custom hook that returns the user's OS.
useOS
useOutsideClick is a custom hook that detects click events outside of an element.
useOutsideClick
usePrevious is a custom hook for obtaining the previous value.
usePrevious
useProcessing is a custom hook for handling processing states.
useProcessing
usePromiseDisclosure is a custom hook that helps handle common open/close or toggle scenarios with promises. It can be used to control components such as Modal, Dialog, Drawer, etc.
usePromiseDisclosure
useResizeObserver is a custom hook that tracks changes in the size and position of an element.
useResizeObserver
useSnacks is a custom hook for controlling notifications used in forms and other similar situations.
useSnacks
useTheme is a custom hook that returns a function for retrieving and switching themes.
useTheme
useTimeout is a custom hook that executes a function after a specified number of milliseconds.
useTimeout
useToken is a custom hook for retrieving tokens from the theme.
useToken
useBreakpointEffect is a custom hook that skips the side effect on the initial render and executes a specific callback function when the breakpoint changes.
useUpdateEffect is a custom hook that skips side effects on the initial render, and only runs them when the dependency array changes.
useUpdateEffect
useValue is a custom hook that combines useBreakpointValue and useColorModeValue.
useValue
useWindowEvent is a custom hook that assigns an event listener to window.
useWindowEvent
window
Edit this page on GitHub