Introducing KiCanvas

I'm really excited to share what I've been working on these last few months: KiCanvas, an interactive, browser-based, open source viewer for KiCAD files.

KiCanvas is early alpha but I feel it's time to let it out into the world for all of you to try out and break. Presently, KiCanvas functions as a standalone web application that can view files stored on GitHub - providing an easy way to share your designs with others. However, this is just the beginning of my plans for this project. You can head over to kicanvas.org right now to to try it out, but if you'd like to read on you can learn more about the history of the project and the future plans.

Status and roadmap

To re-iterate: KiCanvas is very much early alpha. For this initial version I wanted to focus on a specific use case: easily sharing design files. There's going to be bugs and missing features even within this very limited initial scope. I'm happy to get feedback and bug reports, that's the whole idea behind releasing early- just please be kind and remember it's not intended to be perfect yet. There's a list of known issues and limitations as well as an FAQ.

As the current functionality stabilizes and matures, I'll start focusing on the remainder of the roadmap. The most important thing is the Embedding API, which will let folks embed schematics and boards within web pages - just like the prototype below. It's my hope that this will make creating beautiful, interactive, informative hardware documentation easier. In the end, I hope to make it as easy as using an <img> or <video> tag:

<kicanvas src="cool-schematic.kicad_sch"></kicanvas>

If you have thoughts about the embedding API or how you might want to use it, feel free to reach out on GitHub or Discord. I'd love to hear your thoughts.

Origins

KiCanvas started as an absurd side quest: while I was writing Creating a pick and place control board with the RP2040 I wanted to show parts of the schematic in the article to help illustrate and explain how the project works. In the past, I've used screenshots and even re-illustrated using graphic design tools, but those approaches require time and can lead to pretty mixed results. So, in a fit of brilliant, ADHD-fueled recklessness, I wrote a quick and dirty parser and Canvas-based renderer for .kicad_sch files - just enough to embed the schematics I wanted in that article. The result was beautiful even if the code was chaotic:

Thankfully, the article was well received and folks really liked the interactive schematics. This got me thinking - why isn't there a browser based viewer for KiCAD files? The closest thing we have is InteractiveHtmlBom but it only handles boards and requires a KiCAD plugin to generate the files ahead of time. I wanted a truly seamless experience - point it at a KiCAD file and it'll show it.

At the end of December, after working through various proof of concepts, I shared the idea of KiCanvas and asked for financial support to spend time creating it. I am absolutely blown away by the number of people who sponsored this project. Having a little financial security for a few months means so much to me. I also really appreciate everyone who spent time talking to me about how KiCanvas would be helpful to them.

Onward

I wanted to keep this post short and sweet and let you curious cats explore all of the various links here. I hope KiCanvas can eventually become something useful to the entire Open Hardware community. I'm so excited about the future of this project - it hasn't even reached its final form!

This is a project I'm truly creating for the community. It will always be free and open source. I'm thankful for everyone who's shown excitement, provided feedback, and supported me in various ways. I'd really like to thank the following people for their overwhelming support and kindness:

With that, go forward and share your designs and stay tuned for more!