🔍 JSON Viewer

A beautiful, modern JSON viewer with interactive tree view, card view, and styled Excel export.

🚀 Live Demo

---

✨ Features

Feature	Description
🌳 Tree View	Interactive, collapsible JSON tree with syntax highlighting
🎴 Card View	Beautiful card layout with data tables for arrays
📊 Excel Export	Export to styled Excel (.xls) with colors & formatting
📁 File Upload	Drag & drop or upload JSON files
📋 Copy JSON	One-click formatted JSON copy
🔍 Statistics	View object count, arrays, keys, and values
🎨 Dark Theme	Modern dark theme with glassmorphism effects

---

🚀 Quick Start

Online

Visit zerwone.github.io/JSON-Viewer

Local

1. Clone the repository

git clone https://github.com/zerwone/JSON-Viewer.git

2. Open index.html in your browser

---

📸 Screenshots

Tree View

• Collapsible nodes
• Syntax highlighting
• Item counts

Card View

• Data table for arrays
• Property grids
• Type badges

Excel Export

• Styled headers
• Alternating row colors
• Auto column widths

---

🛠️ Tech Stack

• HTML5 - Structure
• CSS3 - Modern styling with CSS variables
• JavaScript - Vanilla JS, no dependencies

---

📝 Usage

1. Paste JSON - Paste your JSON directly into the input area
2. Upload File - Click "Upload File" to load a .json file
3. Toggle View - Switch between Tree and Card views
4. Export - Click "Export Excel" for a styled spreadsheet

---

🤝 Contributing

Contributions are welcome! Feel free to:

• 🐛 Report bugs
• 💡 Suggest features
• 🔧 Submit pull requests

---

📄 License

MIT License - feel free to use this project for personal or commercial purposes.

---

Made with ❤️ by zerwone