https://github.com/arnav-kr/json-formatter

A Browser Extension to format JSON in the browser automatically. Available with 60+ Themes, Syntax Highlighting, automatically linkifies links and more.
https://github.com/arnav-kr/json-formatter

beta browser-extension chrome chrome-extension chrome-extensions dark-mode dark-theme extension extensions json json-formatter json-prettifier json-viewer lightweight open-source syntax-highlighting treeview works-offline

Last synced: 23 days ago
JSON representation

A Browser Extension to format JSON in the browser automatically. Available with 60+ Themes, Syntax Highlighting, automatically linkifies links and more.

• Host: GitHub
• URL: https://github.com/arnav-kr/json-formatter
• Owner: arnav-kr
• License: mit
• Created: 2021-08-29T17:29:39.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2025-01-26T12:42:47.000Z (3 months ago)
• Last Synced: 2025-03-31T08:08:09.625Z (30 days ago)
• Topics: beta, browser-extension, chrome, chrome-extension, chrome-extensions, dark-mode, dark-theme, extension, extensions, json, json-formatter, json-prettifier, json-viewer, lightweight, open-source, syntax-highlighting, treeview, works-offline
• Language: JavaScript
• Homepage: https://json-formatter.js.org
• Size: 9.37 MB
• Stars: 82
• Watchers: 3
• Forks: 17
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        




  

# JSON Formatter

### A Browser Extensions for formating and prettifying JSON but better.

[![Chrome Web Store Version](https://img.shields.io/chrome-web-store/v/gpmodmeblccallcadopbcoeoejepgpnb?style=flat-square&logo=googlechrome&logoColor=%23fff&label=%20&color=%234285F4&labelColor=%233d3d3d)](https://chrome.google.com/webstore/detail/json-formatter/gpmodmeblccallcadopbcoeoejepgpnb)

[![Chrome Web Store](https://img.shields.io/chrome-web-store/rating/gpmodmeblccallcadopbcoeoejepgpnb?style=flat-square&logo=googlechrome&label=Webstore%20Rating&logoColor=%23fff&color=%234285F4&labelColor=%233d3d3d&link=https%3A%2F%2Fchrome.google.com%2Fwebstore%2Fdetail%2Fjson-formatter%2Fgpmodmeblccallcadopbcoeoejepgpnb)](https://chrome.google.com/webstore/detail/json-formatter/gpmodmeblccallcadopbcoeoejepgpnb)

[![Chrome Web Store Users](https://img.shields.io/chrome-web-store/users/gpmodmeblccallcadopbcoeoejepgpnb?style=flat-square&logo=googlechrome&label=Webstore%20Users&logoColor=%23fff&color=%234285F4&labelColor=%233d3d3d&link=https%3A%2F%2Fchrome.google.com%2Fwebstore%2Fdetail%2Fjson-formatter%2Fgpmodmeblccallcadopbcoeoejepgpnb)](https://chrome.google.com/webstore/detail/json-formatter/gpmodmeblccallcadopbcoeoejepgpnb)

[![GitHub](https://img.shields.io/github/license/arnav-kr/json-formatter?style=flat-square&logo=github&logoColor=white&label=GitHub&labelColor=%233d3d3d&color=%234285F4)](https://github.com/arnav-kr/json-formatter)

**[V2.1.10.0 CHANGELOG](CHANGELOG.md)**

## Features:

* 60+ Themes for both Light and Dark Mode

* Syntax Highlighting

* Works Offline

* No tracking or analytics

* Word Wrapping and Sorting Order to stay organized

* Works with any JSON Webpage

* Automatically Linkify Links

* Formats JSON automatically

* `Raw`, `Formatted Raw` and `Parsed` Mode

* Collapse/Expand All option

* Remembers Theme Preferences

* Shortcut Keys for ease of use

* Customize Shortcut Keys

* Collapsible Toolbar







### Default Shortcut Keys Reference:

* `P` - Parsed View

* `R` - Raw View

* `Shift + R` - Formatted Raw View

* `D` - Toggle Dark Mode

* `[` - Collapse All

* `]` - Expand All

* `T` - Toggle Toolbar

Moreover, you can customize these shortcut keys as per your convenience from the extension settings.

## Screenshots:

![Selecting Theme](https://github.com/arnav-kr/json-formatter/blob/main/images/screenshots/selecting-theme.png?raw=true)

![Clickable Links](https://github.com/arnav-kr/json-formatter/blob/main/images/screenshots/clickable-links.png?raw=true)

![Themes Preview](https://github.com/arnav-kr/json-formatter/blob/main/images/screenshots/themes-preview.png?raw=true)

![Different Formatting Options](https://github.com/arnav-kr/json-formatter/blob/main/images/screenshots/different-formatting-modes.png?raw=true)

![Light Theme](https://github.com/arnav-kr/json-formatter/blob/main/images/screenshots/light-theme.png?raw=true)

## Installation

**Method 1** - Install JSON Formatter from [Chrome Web Store](https://chrome.google.com/webstore/detail/json-formatter/gpmodmeblccallcadopbcoeoejepgpnb)

**Method 2** - Install It locally

* clone/download this repo,

* open Chrome and go to chrome://chrome/extensions/,

* enable "Developer mode",

* click "Load unpacked extension",

* select the extension folder in this repo.

### Credits

* [Arnav](https://github.com/arnav-kr)

* Extracts from [pgrabovets/json-view](https://github.com/pgrabovets/json-view)

### License:

[MIT Licence](LICENSE)