?
{ { ... 14 }
"name": "json-in-details",
"version": "0.13.0",
"license": "MIT",
"repository": { { ... 2 },
"type": "git",
"url": "https://github.com/diogenesofweb/json-in-details.git"
},
"description": "Simple JSON viewer",
"keywords": [ [ ... 4 ],
"json",
"json-display",
"json-view",
"json-viewer"
],
"homepage": "https://github.com/diogenesofweb/json-in-details",
"scripts": { { ... 11 },
"dev": "vite dev",
"build": "vite build",
"preview": "vite preview",
"package": "svelte-kit sync && svelte-package && publint",
"prepublishOnly": "npm run package",
"prepub": "npm version minor && npm run package",
"pub": "npm publish && git push && git push --tags",
"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
"lint": "prettier --plugin-search-dir . --check .",
"format": "prettier --plugin-search-dir . --write ."
},
"exports": { { ... 2 },
".": { { ... 2 },
"types": "./dist/index.d.ts",
"default": "./dist/index.js"
},
"./styles.css": "./dist/styles.css"
},
"files": [ [ ... 3 ],
"dist",
"!dist/**/*.test.*",
"!dist/**/*.spec.*"
],
"devDependencies": { { ... 18 },
"@kazkadien/svelte": "^0.32.0",
"@sveltejs/adapter-auto": "^3.1.1",
"@sveltejs/adapter-cloudflare": "^4.1.0",
"@sveltejs/kit": "^2.5.1",
"@sveltejs/package": "^2.2.7",
"@sveltejs/vite-plugin-svelte": "^3.0.2",
"genson-js": "^0.0.8",
"html-to-image": "^1.11.11",
"idb": "^8.0.0",
"json-to-ts": "^1.7.0",
"prettier": "^3.2.5",
"prettier-plugin-svelte": "^3.2.1",
"publint": "^0.2.7",
"svelte": "^4.2.12",
"svelte-check": "^3.6.4",
"tslib": "^2.6.2",
"typescript": "^5.3.3",
"vite": "^5.1.4"
},
"types": "./dist/index.d.ts",
"main": "./dist/index.js",
"type": "module"
}

JSON-in-details

Free online JSON viewer, formatter and converter

Better JSON search

  • Press COLLAPSE icon .
  • Press Ctrl+F.
  • Browser will auto expand matched nodes.

Keymaps (Vim inspired)

  • h | ArrowLeft - Move focus to the parent node.
  • j | ArrowDown - Move focus to the next sibling node.
  • k | ArrowUp - Move focus to the previous sibling node.
  • l | ArrowRight - Move focus to the child node.
  • c - Fold all child nodes.
  • e - Unfold all child nodes.
  • y - Copy node content.
  • p - Copy node path.

Convert JSON

Why to use this app?

Elegant UI:

  • Foldable and filterable and focusable nodes.
  • Show node path on focus and hover.
  • Configurable clickable links.
  • Light and dark theme.

Functionality:

  • Filter nodes.
  • Collapse all nodes.
  • Expand all nodes.
  • Save JSON.
  • Copy JSON.
  • Copy node.
  • Copy node path.
  • Switch between formatted and raw data.
  • Sticky panels.
  • Converting JSON.
  • (Shift-)Tab navigation.
  • Keymaps (Vim inspired).
  • History.
  • New JSON entry via file upload, fetch URL or insert JSON string.
  • JSON screenshot (JSON to image .jpeg).

What is JSON ?

JSON (JavaScript Object Notation) is a lightweight data-interchange format that is easy for humans to read and write, and easy for machines to parse and generate. It is based on a subset of the JavaScript Programming Language Standard and is completely language independent. JSON is built on two structures: a collection of name/value pairs and an ordered list of values. It can be used with various programming languages and supports objects, arrays, strings, numbers, true/false, and null values. JSON is widely supported and can be used for data interchange between different programming languages.