A powerful, feature-rich JSON viewer built with Electron. Navigate large JSON structures with ease using array indices, string length indicators, full-screen mode, and advanced customization options.
- Multi-tab Interface - Work with multiple JSON files simultaneously
- Large File Support - Handle massive JSON files with 1+ million lines efficiently
- File Operations - Load JSON files, paste content, or use recent files menu
- Real-time Validation - Instant JSON syntax validation and error reporting
- Format & Minify - Pretty-print or minify JSON with one click
- Search & Navigation - Powerful search with key/value filtering and highlighting
- Tree View - Collapsible JSON structure with state-preserving expand/collapse controls
- Array Index Display - Shows
[0],[1],[2]indices for easy array navigation (toggleable) - String Length Badges - Character count display for long strings with configurable threshold
- Full-Screen Mode - Distraction-free viewing with F11 toggle
- Recent Files - Quick access to your last 10 opened JSON files
- Character Encoding Detection - Automatic detection and handling of files with special characters (Latin-1/ISO-8859-1)
- Windows Context Menu - Right-click any .json file to open directly in JSONinja
- 4 Built-in Themes - Dark, Light, GitHub, and Monokai with theme-aware rainbow brackets
- Font Customization - Choose from 5 coding fonts (Fira Code, Monaco, Source Code Pro, JetBrains Mono, Cascadia Code) with adjustable sizes
- Color Coding - Individual color controls for keys, strings, numbers, booleans, null values, and brackets
- Rainbow Brackets - 8-color cycling bracket system for visual nesting clarity
- Display Options - Toggle array indices, string length badges, line numbers, word wrap
- Smart Settings - Configurable string length threshold (10-100 characters)
- State Preservation - Tree expansion state maintained when toggling display options
- Multi-mode Search - Search keys, values, or both
- Real-time Highlighting - Instant visual feedback
- Navigation Controls - Previous/next result navigation with keyboard shortcuts
- Match Counter - See total matches and current position
Ctrl/Cmd + T- New tabCtrl/Cmd + W- Close tabCtrl/Cmd + O- Open fileCtrl/Cmd + F- Find/SearchCtrl/Cmd + E- Expand allCtrl/Cmd + Shift + E- Collapse allCtrl/Cmd + ,- SettingsF11- Toggle full-screen modeEsc- Close dialogs/panels
- Windows Installer: JSONinja-Setup.exe
- Windows Portable: JSONinja-Portable.exe
- macOS: JSONinja.dmg
- Linux AppImage: JSONinja.AppImage
- Others: View All Releases
Windows:
- Download and run the installer setup or portable version
- Optional: Follow the setup wizard if running the installer
Linux:
- Download the AppImage
- Make executable:
chmod +x JSONinja.AppImage - Run:
./JSONinja.AppImage
📋 Note: macOS builds coming soon! For now, you can build from source.
View All Releases | Report Issues
- Node.js (v18 or higher)
- npm or yarn
- Git
git clone https://github.com/KrunchMuffin/JSONinja.git
cd JSONinjanpm install# Start the application
npm start
# Or with development features
npm run dev# Build for current platform only
npm run build
# Build for specific platforms
npm run build-win # Windows (x64 only)
npm run build-mac # macOS (Intel + Apple Silicon)
npm run build-linux # Linux (x64 only)
# Build for all platforms
npm run build-allBuilt files will be in the dist/ folder.
- Windows: NSIS installer + Portable executable (x64 only)
- macOS: DMG installer + ZIP archive (Intel + Apple Silicon)
- Linux: AppImage + DEB + RPM packages (x64 only)
The app uses electron-builder with these features:
- 64-bit only - No 32-bit builds for better performance
- Portable options - No installation required versions available
- Multiple formats - Choose the package format that works for you
- Optimized packaging - Only includes necessary files
- Launch the app - Start with the welcome screen
- Load JSON - Click "Load JSON File" or "Paste JSON"
- Multi-tab - Use Ctrl+T to open new tabs for multiple files
- Navigate - Use the tree view to explore JSON structure
- From File: Click "Load JSON File" or use Ctrl+O
- Right-Click: Right-click any .json file and select "Open with JSONinja"
- Recent Files: Quick access to your last 10 opened files via menu
- Paste: Click "Paste JSON" and paste your content
- Drag & Drop: Drag JSON files directly onto the application
- Open Settings - Click settings button or press Ctrl+,
- Choose Theme - Select from Dark, Light, GitHub, or Monokai
- Adjust Fonts - Pick font family and size
- Customize Colors - Set colors for each JSON data type
- Configure Behavior - Toggle features like auto-expand, data types, etc.
- Open Search - Press Ctrl+F or click the search icon
- Choose Mode - Select Keys, Values, or Both
- Navigate Results - Use arrow buttons or Enter/Shift+Enter
- Visual Feedback - Matches are highlighted in yellow, current match in orange
- Expand/Collapse - Click arrows next to objects/arrays (state preserved when toggling settings)
- Expand All - Ctrl+E expands everything
- Collapse All - Ctrl+Shift+E collapses everything
- Array Indices - Toggle
[0],[1],[2]display for arrays (default: on) - String Length - Show character count for long strings with configurable threshold
Stats Bar- Coming back soon!Path Display- Coming back soon!- Rainbow Brackets - Color-coded bracket nesting with 8-color cycle
- Full Screen - F11 for distraction-free viewing
- Line Numbers - Toggle in quick settings
- Word Wrap - Enable for long lines
JSONinja/
├── package.json # Project configuration & dependencies
├── main.js # Electron main process with recent files
├── preload.js # Secure IPC bridge
├── index.html # Main application UI with new controls
├── styles.css # All application styles including themes
├── renderer.js # Application logic & state management
├── CHANGELOG.md # Version history and features
└── README.md # This file
- Edit the CSS custom properties in
styles.css - Add new theme option in
renderer.js - Update theme selector in settings panel
- UI Components - Add to
index.htmland style instyles.css - Logic - Implement in
renderer.js - Settings - Add to settings object and persistence
- Keyboard Shortcuts - Add to
handleKeyboardShortcutsmethod
The app uses CSS custom properties for theming:
--json-key- Object keys--json-string- String values--json-number- Number values--json-boolean- Boolean values--json-null- Null values--json-bracket- Brackets and punctuation--json-object- Object bracket colors--json-array- Array bracket colors.bracket-level-0through.bracket-level-7- Rainbow bracket colors
App won't start
- Ensure Node.js v16+ is installed
- Run
npm installto install dependencies - Check for error messages in terminal
JSON won't load
- Verify JSON syntax is valid
- Check file encoding (should be UTF-8)
- Try pasting content instead of file loading
Search not working
- Ensure JSON is loaded and valid
- Check search mode (keys/values/both)
- Clear search and try again
Settings not saving
- Check file permissions in app data directory
- Try resetting to defaults
- Restart the application
- Handles JSON files up to ~10-20MB (performance depends on structure complexity)
- Use "Collapse All" and disable array indices for better performance with large files
- String length badges can be disabled to reduce visual clutter
- Tree state preservation maintains performance during setting changes
- Search may be slower on very large files
Windows
- Uses NSIS installer by default
- Executable created in
dist/folder - May require Windows Defender exclusion
macOS
- Requires code signing for distribution
- Uses standard .app bundle format
Linux
- Builds as AppImage by default
- Can also build .deb and .rpm packages
To contribute to this project:
- Fork the repository
- Create a feature branch
- Make your changes
- Test thoroughly
- Submit a pull request
MIT License - feel free to use and modify as needed.
Built with ❤️ using:
- Electron - Cross-platform desktop apps
- Modern CSS - Custom properties and grid
- Vanilla JavaScript - No frameworks needed
- electron-builder - Packaging and distribution