JSON Modal Viewer & Formatter

About

JSON Modal Viewer & Formatter

JSON Modal Viewer & Formatter makes working with JSON in the browser faster, cleaner, and far more efficient. View, format, and inspect JSON directly on any webpage without copying it into external tools.

If you work with APIs, logs, admin panels, or documentation, this extension helps you read and manage JSON instantly, right where you find it.

Why install it?

Switching tabs just to format JSON slows you down. This extension keeps everything inside your workflow, saving time and reducing friction.

Key Features

Automatic JSON Detection
When you open a page that contains raw JSON, such as API endpoints or REST responses, the extension detects it automatically and provides quick-access viewing buttons.

Inline buttons appear next to detected JSON blocks, and a floating button shows up in the bottom-right corner on raw JSON pages. It also works with dynamically loaded content, including SPAs and lazy-loaded data.

Smart Selection Tooltip
Select any valid JSON text on a webpage and a small {} icon appears near your cursor. Click it to instantly open a formatted JSON modal.

Perfect for inspecting embedded JSON in logs, documentation, dashboards, or admin systems.

Advanced JSON Viewer
JSON opens in a professional editor powered by CodeMirror, with:

- Syntax highlighting
- Line numbers
- Code folding
- Active line highlighting
- Automatic formatting for readability
- Support for JSON files up to 1MB

This makes large payloads significantly easier to understand.

Multiple Copy Options
Copy your JSON in one click in three formats:

- Pretty-printed (indented and readable)
- Minified (compact, single line)
- Original (exact source)

Light, Dark, and System Themes
Choose between Light, Dark, or System mode. The selected theme applies consistently to both the settings popup and the JSON viewer modal.

Real-Time Controls
Enable or disable automatic detection and the selection tooltip independently.

All changes apply instantly to the current page, no refresh required.

Live Preview
Preview how the JSON viewer will look with your current settings directly inside the extension popup.

Privacy & Security

Your data stays yours.

The extension only uses storage permission to save your preferences. No data is collected, transmitted, or shared. All processing happens locally in your browser.

Ideal For

- Developers inspecting REST or GraphQL API responses
- QA engineers validating request payloads
- DevOps professionals analyzing JSON logs and tool outputs
- Anyone who regularly works with JSON and wants a faster way to read it

Built With

React 18
CodeMirror 6
Tailwind CSS
Chrome Extension Manifest V3

If you frequently deal with JSON in the browser, this extension turns messy raw data into something readable and actionable, instantly.