Shadcn.io is not affiliated with official shadcn/ui
React useReadLocalStorage Hook
React useReadLocalStorage hook for read-only localStorage access. Cross-tab sync, TypeScript generics, SSR safe.
React useReadLocalStorage Hook preview
Read localStorage values reactively without writing. useReadLocalStorage subscribes to a storage key and returns the current value with live updates. Syncs across browser tabs via storage events. Also listens for custom local-storage events from useLocalStorage for same-tab sync. Returns null if key is missing. Custom deserializer support for complex types. TypeScript generics for type-safe returns. Handles JSON parsing errors gracefully with console warnings. Perfect for reading shared state, feature flags, user preferences, or any localStorage data you do not own. SSR safe with configurable initialization.
Install with AI
If you've connected the shadcn.io MCP server to Claude Code, Cursor, Windsurf, or any MCP-ready AI editor, prompt your agent to install this hook for you — no copy-paste, no CLI:
use shadcnio to install the use-read-local-storage hook into my projectRelated Components
React useLocalStorage Hook
Read and write localStorage
React useSessionStorage Hook
Session-scoped persistent state
React useDarkMode Hook
Dark mode with persistence
React useMediaQuery Hook
Respond to CSS media queries
React useEventListener Hook
Declarative DOM event handling
React useIsClient Hook
Check if running on client
FAQ
Was this page helpful?
Sign in to leave feedback.