An interactive pinout generator for PCBs. PinConnect turns a photo of a board into an interactive pinout diagram you can open in a browser or embed in a documentation site.
A generated pinout for the Birds' Nest CAN board — hover a connector on the board for its pinout, or open the connector list to browse every connector at once.
It is made of three tools, used in sequence:
- pinout-design: a browser-based designer that turns a board image into a TOML config.
- pinout-gen: a CLI that reads that config and generates a single interactive HTML pinout.
- pinout-embed: an optional Markdown extension that embeds the generated HTML into MkDocs / Zensical sites.
You only need the first two for a working pinout; the third is for publishing to a Markdown docs site.
If you'd like to see a live demo of the generated pinouts, you can find it on this documentation website: https://docs.isiks.tech/pinouts/bnc/bnc.pinout.html
-
Serve the designer and open it in your browser:
cd pinout_design python -m http.server 8000 # then open http://localhost:8000
Load a board image, draw a box over each connector, label the pins, and Save TOML.
-
Install the generator and render your config:
pip install ./pinout_gen pinout-gen board.toml # writes board.pinout.html -
(Optional) Embed the result in an MkDocs / Zensical page — see pinout-embed.
Full walkthrough: docs/getting-started.md.
All guides live in the docs/ folder — start with the documentation index:
pinout_design/: the visual designer (static web app).pinout_gen/: thepinout-genCLI, connector type library, and themes.pinout_embed/: the Markdown embedding extension.docs/: documentation.
Each package folder has its own README with a short overview.
This project is licensed under GPL-3.0. See LICENSE.
If you'd like to support the development of this and other open-source projects, you can donate on GitHub Sponsors or Patreon.
