JSON Viewer Chrome Extension

SUMMARY

A clean and powerful JSON viewer extension for Chrome with tree view and text view support.

## Features

- 🌲 Tree View: Collapsible tree structure for better JSON visualization
- 📝 Text View: Traditional text view with line numbers and code folding
- 🎨 Dark/Light Theme: Seamless integration with Chrome themes
- 🔍 Long String Handling: Automatically truncates long strings with expandable view
- 📊 Object Size: Shows the number of items in arrays and objects
- 🔗 URL Detection: Automatically converts URLs to clickable links
- ⌨️ Keyboard Friendly: Easy navigation and interaction
- 🎯 Line Numbers: Clear line numbers with folding indicators
- 🚀 Performance: Handles large JSON files smoothly

## How to Use

1. Open a JSON file in Chrome
2. Click the "Open JSON Viewer" button in the editor title bar, or:
3. Right-click in the editor and select "Open in JSON Viewer"
4. Use the toolbar buttons to:
- Switch between Tree and Text views
- Toggle dark/light theme
- Expand/collapse all nodes in tree view
- Click on line numbers to fold/unfold sections in text view
- Click on truncated strings to expand/collapse them

## View Modes

### Tree View
- Hierarchical visualization of JSON structure
- Click on arrows (▶/▼) to expand/collapse nodes
- Shows array/object sizes
- Hover effects for better readability

### Text View
- Traditional JSON text representation
- Line numbers with folding capability
- 4-space indentation
- Long string truncation with expandable view
- Syntax highlighting


## Demo
https://microsoftedge.github.io/Demos/json-dummy-data/64KB.json

The latest version of JSON Viewer Chrome Extension is available on the Chrome web and is currently being used by 0 active users. The initial version was launched on 2025-01-07.

HOW TO INSTALL JSON Viewer Chrome Extension FROM A CRX FILE

1. Download JSON Viewer Chrome Extension CRX file
2. NOTE: Sometimes the browser may block downloading / installing CRX file from outside the Chrome Web Store. If so, you may need to download the ZIP file instead
3. In the URL bar, go to chrome://extensions
4. Enable Developer mode

Ratings

USER REVIEWS (0)