JSON Pretty-Print on Any Page

WHAT IT DOES This script automatically detects JSON data on any page—whether inside or tags or embedded in plain text—and transforms it into a beautifully formatted, syntax-highlighted, and collapsible view. It adds indentation, color-codes keys, strings, numbers, booleans, and null values, and makes nested objects and arrays collapsible for easy navigation. A floating toolbar provides one-click access to copy the JSON to your clipboard, download it as a file, expand or collapse all sections, and search through the data. You can toggle between raw and pretty views, adjust indentation size, and control collapse depth. WHERE IT RUNS The script works on any page with JSON data—API response pages, configuration files, log outputs, data dumps, and any page displaying structured data. It detects JSON in and elements as well as plain text blocks, and works on any website, adapting to each page's structure. HOW TO USE After installation, the script automatically detects JSON data on the page and formats it with syntax highlighting. A floating toolbar appears with buttons to copy, download, expand all, collapse all, and search. Use the panel to customize settings: enable or disable auto-detection, toggle the toolbar and syntax highlighting, switch between dark and light modes, choose indentation size (2 spaces, 4 spaces, or tab), and set the collapse depth (objects beyond this depth are automatically collapsed). Click "Detect & Format JSON" to manually trigger detection, or "Refresh" to re-apply formatting. The "Remove Formatting" button reverts the page to its original state. TECHNICAL MECHANISM The script uses a multi-stage JSON detection and formatting pipeline. First, it scans the DOM for potential JSON content using a TreeWalker on text nodes and direct element queries on and tags, with size limits to avoid memory issues. Second, it validates each candidate using JSON.parse to confirm it's valid JSON. Third, it formats the data using JSON.stringify with the configured indentation. Fourth, it generates syntax-highlighted HTML by splitting the formatted JSON into lines, detecting element types (keys, strings, numbers, booleans, null, brackets), and wrapping each with appropriate CSS classes. Fifth, it builds collapsible sections by tracking indentation depth and adding toggle controls for nested objects and arrays beyond the configured collapse depth. Sixth, it replaces the original content with the formatted view and creates a floating toolbar with clipboard, download, collapse, expand, and search functionality. THE PANEL The settings panel is fully draggable and can be positioned anywhere on your screen. It automatically snaps to the nearest edge when released, keeping your workspace organized. The panel can be collapsed to a small bubble showing only a gear icon, and restored with a single click. Its position is remembered across page reloads using GM_setValue. The panel also responds to the Escape key, which instantly hides it until you click the bubble again. All settings are saved immediately when changed and persist across browser sessions. PLEASE NOTE This script requires the free BotGentz extension to run. Large JSON files may affect performance; the script has a configurable maximum size limit (default 500KB). Formatting is applied only to valid JSON detected on the page. The script does not access, store, or transmit any personal data or browsing history. All JSON data is processed locally in your browser and never leaves your device.