JSON viewer for developers.
Clean syntax highlighting, fast search, and keyboard shortcuts. Use it in Chrome for debugging or embed it in your React app.
Install via pnpm
pnpm add @json-lens/react
Use the same viewer inside React apps, docs portals, and observability dashboards.
Chrome extension
View JSON responses and API previews with clean formatting. No more copying raw text into external tools.
Key features
- No more squinting at raw text → Syntax highlighting
- Find what you need fast → Built-in search
- Grab data quickly → One-click copy
Built for developers who work with JSON
Whether you're debugging API responses or building dashboards, JSON Lens gives you the same clean interface everywhere.
Fast performance
Handles large JSON files smoothly. Expand thousands of nodes without slowdown.
Smart search
Find text across keys and values. Results highlight automatically.
Customizable themes
Multiple built-in themes to match your editor. Switch anytime.
Browser and React
Use the Chrome extension for debugging or the React package in your app.
View JSON in your browser
Makes JSON pages readable. Syntax highlighting, search, themes. Works on any JSON URL.
Embed in your React app
A React component for displaying JSON. Customizable themes, search, copy helpers. Install with pnpm.
Interactive playground
Try different themes, paste your own JSON, and experiment with settings. Runs the live `@json-lens/react` package.
Theme
Switch between the built-in themes or scan the full catalog. Active theme: System(dark).
Viewer props
Adjust the inputs passed to the `JsonView` component.
Use JSON Lens in admin dashboards, documentation, or debugging tools. The Chrome extension uses the same interface.
Get started with JSON Lens
Install the Chrome extension for debugging or add the React package to your app. Same clean interface, works everywhere.