JSON Schema Diagram

jsonschema_diagram is a frontend-first viewer for JSON Schema documents. It turns nested objects, arrays, refs, combinators, enums, and pattern-based objects into an explorable node graph that can run as:

• a normal static site

• a self-contained embed artifact

• a Python-rendered HTML snippet

• a Sphinx directive inside docs

The codebase is intentionally split so that parsing, graph building, ref resolution, layout, and interaction all stay in the browser, while Python handles serving, embedding, packaging, and documentation workflows.

What This Documentation Covers

This documentation set is broader than the demo page. It explains:

• how to run the web app locally

• how site and embed modes differ

• how to use the Python API and CLI

• how to integrate the Sphinx extension

• which JSON Schema features are supported today

• how path formatting works in the selection dialog

• how to troubleshoot common frontend, embed, and docs issues

• how to work on the project itself

Guides

Guides

• Getting Started
  • Project Shape
  • Requirements
  • Frontend Setup
  • Production-Like Local Run
  • Embed Artifacts
  • Python Package Setup
  • Build The Docs
  • Suggested First Run
• Viewer Modes
  • Site Mode
  • Embed Mode
  • Runtime Config
  • Schema Resolution Priority
  • Theme Behavior
  • Interaction Model
• Python API
  • Installation
  • Core Imports
  • Loading Schemas
  • Rendering Embed HTML
  • Writing Embed Files
  • Serving The Site
  • Custom Paths
  • Theme Validation
  • When To Use The API
• CLI
  • Installation
  • Command Overview
  • serve
  • render-embed
  • Examples
  • Choosing Between CLI And API
• Sphinx Extension
  • Why This Extension Exists
  • Installation
  • Basic Configuration
  • Config Values
  • Directive Syntax
  • Schema Sources
  • Theme Override Per Diagram
  • Build Workflow
  • How Rebuild Tracking Works
  • When Not To Use The Extension

Reference

Reference

• Schema Support
  • Core Supported Keywords
  • Objects
  • patternProperties
  • Arrays
  • Enums And Const
  • Combinators
  • Refs
  • Path Semantics
  • Current Limits
• Troubleshooting
  • Frontend Build Not Found
  • Embed Changes Do Not Show Up In Docs
  • Opening Non-Self-Contained HTML Over file://
  • Sphinx Theme Not Found
  • Clipboard Paste Does Not Work
  • Huge Bundle Warning During Build
  • Broken Or Stale Theme In Embed
  • Pattern Property Paths Look Surprising
  • Combinator Branch Paths Use [*]
• Development
  • Repository Layout
  • Common Commands
  • Useful Development Flows
  • Shared Assets And Contracts
  • Themes
  • Docs Maintenance
  • Release Checklist

Examples

Examples

• Extension Demo
  • Shared Default Schema
  • Schema From File
  • Inline Schema
  • Theme Override