LocalStorage Viewer and Editor
Free online LocalStorage Viewer and Editor that runs directly in your browser.
-
1Enter data
Enter content, paste text or load a file from disk. -
2Click the button
The tool will immediately process your data in the browser. -
3Get the result
Copy the finished text or save the file to your device.
return "Result ready in 0.1s";
}
Rate this tool:
Related tools
Other tools you may find usefullocalStorage Preview and Editor - Manage browser data
ThelocalStorage editor allows you to view, add, edit and delete browser localStorage data directly from the web interface. It displays keys and values in a readable form, supports JSON validation and shows the used storage space.
What is localStorage?
localStorage is a client-side web browser storage mechanism introduced in HTML5. Data in localStorage is: persistent - remains after closing the browser (unlike sessionStorage), assigned to origin (protocol + domain + port) - websites from different domains do not have access to them, stored as key-value pairs where both key and value are strings, limited in capacity - usually 5-10 MB per origin (depending on the browser). Comparison with cookies: localStorage is not sent automatically with HTTP requests (less CSRF risk), has a larger capacity (4 KB vs 5 MB), has no expiration option.
localStorage API in JavaScript
Basic operations:localStorage.setItem('key', 'value')- save,localStorage.getItem('key')- read (null if does not exist),localStorage.removeItem('key')- remove,localStorage.clear()- remove all,localStorage.length- number of items,localStorage.key(index)- key under the index. JSON object storage:localStorage.setItem('user', JSON.stringify({name: 'Jan', age: 30}))- reading:JSON.parse(localStorage.getItem('user')). The editor visualizes JSON in a tree structure for easier navigation.
Applications of localStorage in web applications
localStorage is commonly used to: remember user preferences (dark theme, language, layout), store authorization tokens (JWT - note: XSS risk), API data cache (temporary response storage), store the state of SPA applications (React, Vue, Angular), remember completed forms (auto-save drafts), shopping cart for unlogged users, search history and recent activities.
LocalStorage Security
Important security aspects:XSS vulnerability- If an attacker executes JavaScript on your site (XSS), they can read the full contents of localStorage. Never store passwords, private keys or payment card details in localStorage.Is not encrypted- data is stored as plaintext (visible by DevTools).Self-closing- only available for the same origin, not sent automatically (more secure than cookies in this respect).Alternatives for sensitive data: httpOnly cookies (not available for JS), IndexedDB with encryption, server.
FAQ
How to check and clear localStorage in Chrome?
Chrome DevTools: F12 → Application (or Application) → Storage → Local Storage → select origin. The view shows all keys and values. Delete a single: select the row → Delete. Clear all: right click on origin → "Clear". Or in the console:localStorage.clear(). Filters allow you to search by key.
What is the maximum capacity of localStorage?
Most often 5 MB per origin (Chrome, Firefox, Safari). Edge: 10MB. Check the current capacity:navigator.storage.estimate().then(e => console.log(e.quota, e.usage)). When you exceed the limit, setItem throws a QuotaExceededError exception. For larger data: IndexedDB (gigabytes), Cache API (Service Worker), or server. The editor shows the current position in the KB.
What is the difference between localStorage and sessionStorage?
localStorage: persistent after closing the tab/window/browser, shared between tabs of the same origin. sessionStorage: lasts only for the duration of the session (closing the tab deletes the data), separate for each tab (even the same origin). Both: 5 MB, strings only, synchronous API, access via JS. Select localStorage for persistent preferences, sessionStorage for temporary form state.
Is localStorage available in private mode (Incognito)?
Yes - localStorage works in private mode, but is separate from normal localStorage (miscellaneous data) and is deleted when the private window is closed. Browsers may restrict access to localStorage when cookies are blocked (Safari ITP) - check with try/catch:try { localStorage.setItem('test','x'); } catch(e) { console.log('localStorage blocked'); }.
How to synchronize localStorage between browser tabs?
Storage event:window.addEventListener('storage', (e) => { console.log(e.key, e.oldValue, e.newValue); });. This event fires in OTHER tabs of the same origin when localStorage changes (not in the same tab). For communication between cards: BroadcastChannel API (new BroadcastChannel('channel')), SharedWorker, or storage events. The editor automatically refreshes the view when another window changes localStorage.