Skip to content

Instantly share code, notes, and snippets.

View notwaldorf's full-sized avatar
🐱💻

Monica Dinculescu notwaldorf

🐱💻
View GitHub Profile
@mattdesl
mattdesl / about.md
Last active December 15, 2023 17:45
png + svg export with canvas-sketch and context 2D

PNG + SVG export from canvas-sketch

The helper function canvas-to-svg.js wraps a given render function (or renderer object) so that you can use Canvas2D context methods as usual, but upon single frame export (with Cmd/Ctrl + S) it will produce both a PNG and SVG file.

This uses canvas2svg which is not a perfect solution, as the Canvas2D API was never designed to be translated to SVG. Its best to stick with simple shape and path operations.

Full instructions: first install the canvas-sketch CLI if you haven't already:

npm install canvas-sketch-cli -g