CircuitJSON.com
https://github.com/tscircuit/circuitjson.com- Category
- Developer Tools
- Rank
- No. 1675Tools index
Previous survey · No. 1632 ·
- Pricing
- Open Source
- Type
- TOOL
- Builder
- tscircuit
- GitHub
- 5 stars
- Date
About
View circuit JSON online — inspect and visualize tscircuit electronics designs in the browser.
What it does
Drop a Circuit JSON file or paste its contents, then explore PCB, schematic, and 3D representations. It also recognizes a simple routing shape and converts its connections into PCB traces before display.
Why it's ranked here
This is a focused, low-friction inspection tool with useful input choices, responsive presentation, and clear invalid-JSON feedback. Its main weakness is operational: rendering depends on the latest external viewer bundle, so behavior can change without this application changing.
What's good
The interface supports dropping files, choosing a file, and pasting raw data. User content is escaped before entering an inline script, while the embedded viewer receives sandbox restrictions. A bundled example gives newcomers a concrete starting point.
Tradeoffs
Parsing checks JSON syntax but does not validate a complete Circuit JSON structure. The visualization layer loads an unpinned package from an external CDN at runtime, creating a network dependency and making viewer behavior less reproducible.
How to use it well
Use it for quick visual checks while producing or exchanging tscircuit data, especially when a full development environment would be excessive. It suits designers and engineers who already have Circuit JSON. It does not replace schema validation, circuit editing, or a reproducible offline review pipeline.
Technical notes+
src/App.tsx reads dropped, selected, or pasted JSON with JSON.parse and converts objects containing connections plus minTraceWidth into pcb_trace records. src/RunFrameCircuitJsonViewer.tsx serializes the data into iframe srcDoc, replaces < with \u003c, and loads @tscircuit/runframe@latest from unpkg under an iframe sandbox. src/store.ts holds the current document in Zustand. package.json exposes Vite start and build scripts; vite.config.ts emits sourcemaps into dist. index.html loads Tailwind through its CDN.
Observed
- License
- MIT License
- Primary language
- TypeScript with React TSX
- Interface
- Browser-based web application
- Build surface
- Vite start and production build scripts
- Package lock
- Bun lockfile included
- Rendering dependency
- Runframe standalone preview loaded from unpkg at runtime
- Input surface
- File drop, file picker, and pasted JSON
- Visualization modes
- PCB, schematic, and 3D views
Read from README.md, package.json, src/App.tsx, src/main.tsx, src/store.ts, src/RunFrameCircuitJsonViewer.tsx, vite.config.ts, docs/reference-implementation.tsx, LICENSE, bun.lock, index.html, biome.json, bunfig.toml, renovate.json, tsconfig.json.
What it can do
View circuit JSON files online
Circuit JSON file → Visual display of circuit data in browser
Inspect tscircuit electronics designs
tscircuit design file → Detailed inspection view of circuit components and connections
Visualize electronics circuit layouts
Circuit design data → Graphical representation of circuit layout
Parse and display circuit component information
Circuit JSON data → Structured view of circuit components and properties
Render interactive circuit diagrams
Electronics design files → Interactive circuit diagram in web browser
Tags
Tech Stack
Comments (0)
No comments yet
Editorially curated, with community endorsements as a secondary signal. Corrections welcome.