Josh W. Comeau

joshwcomeau.com

29 August 2026 17:32

It's a bit clunky and it delays rendering by 1 frame, but it works reasonably well for what I'm doing. Here's the code, if anyone's curious: gist.github.com/joshwcomeau/...

Josh W. Comeau

joshwcomeau.com

29 August 2026 17:32

I thought at first I could do this with `image-rendering: pixelated;`, but at least in Chrome, SVGs are really stubborn. They really want to remain as vectors! So instead, I'm using XMLSerializer to turn the SVG node into a string, and then painting it into a 2D <canvas>. 😂

Josh W. Comeau

joshwcomeau.com

29 August 2026 17:32

Of course, the fact that SVGs are scalable is usually their biggest strength! But in this particular case, I'm going for a pixel-art aesthetic. So why use SVGs at all? I want to procedurally generate dozens of different variations, so I can't just use static jpegs. SVG syntax is perfect for this!

Josh W. Comeau

joshwcomeau.com

29 August 2026 17:32

I'm doing something absolutely ridiculous. 😂 I created a `RasterizedSvg` component that will render an SVG as though it was a raster image, letting us see the pixels if we scale it up. Left: original SVG Right: rasterized SVG

François Zaninotto

francoisz.bsky.social

17 July 2026 15:29

TIL the /insights command on #ClaudeCode lets the agent inspect your session logs, detect when Claude went wrong, suggest fixes in your harness (CLAUDE.md, skills, hooks) and inform you of features you could have used to improve your workflow.