JSON Formatter Chrome Extension

English | 简体中文

A beautiful and practical Chrome extension for formatting and highlighting JSON content. Features a VS Code-style dark theme and provides an interactive JSON viewing experience.

✨ Features

• 🎨 Automatically detects and formats JSON content on pages
• 🌗 VS Code-style dark theme
• 🔍 Collapsible/expandable JSON nodes
• 📊 Display of array and object element counts
• 💅 Beautiful syntax highlighting
• 🖱️ Hover highlighting for JSON properties
• ⚡ Quick expand/collapse all nodes

📦 Installation

1. Download or clone this repository
2. Open Chrome browser and navigate to extensions page (chrome://extensions/)
3. Enable "Developer mode" in the top right corner
4. Click "Load unpacked"
5. Select the project folder

🚀 Usage

1. After installation, visit any page containing JSON content
2. The extension will automatically detect and format JSON content
3. Use the arrow buttons (▶/▼) on the left to expand or collapse JSON nodes
4. Click the extension icon to use "Expand All" or "Collapse All" features

🛠️ Technical Implementation

• Developed using vanilla JavaScript, no external dependencies
• Implements Chrome Extension Manifest V3 specification
• Recursive JSON parsing and DOM rendering
• Smooth animation transitions using CSS
• Optimized performance for handling large JSON data

📄 License

This project is open source under the Apache-2.0 License. See the LICENSE file for details.