Interactive Net Highlighting Demo

This demo showcases the CSS-enabled SVG output from kicad-svg-extras . Click on any net in the list to highlight it on the PCB. Click on the color rectangles to customize net colors - your changes will persist until you reset the view. The SVG uses CSS classes for each net, allowing for dynamic styling and interactive features.

Loading PCB...

Nets

How it works:
Each net is assigned CSS classes like .net-gnd-f-cu for per-layer styling. This enables interactive highlighting, custom themes, and easy integration into web applications.

💡 Tip: Click on the color squares next to net names to customize colors!