Coding Challenge 181: Weighted Voronoi Stippling

The Coding Train
2 HN recommenders · recommended in 2 months, 2025–2026
YouTube
216K views · 2 years ago · tutorial · intermediate · evergreen

Daniel Shiffman of The Coding Train works through a coding challenge that builds weighted Voronoi stippling, turning an image into a pattern of dots whose density follows the image brightness. He codes it live in p5.js and explains the algorithm along the way.

HN people recommend it as a more fun and better-looking alternative to standard dithering for turning images into dots.

“for something more fun and even better looking I recommend the Coding Train video on Weighted Voronoi Stippling”
Generative artPhotography & image making
#voronoistippling#creativecoding#p5.js#dithering#codingtrain

2 comments from Hacker News

r
@rpastuszak2026 · in “Dithering with CSS”
Hm, for this - yes I think it would make sense. That being said there are libraries that apply proper dithering without relying on SVG filters. Also, I haven't tested this with canvas which I imagine would be much more consistent. If I were to do this... more seriously, I'd keep some parameters exposed in the shortcode/component rendering the dithered images (or data-attrs) so that I could fine-tune them on a case-per-case basis. (I originally wanted to replace the bio photos on my site, like this one link) There's a ton of articles about this but for something more fun and even better looking I recommend the Coding Train video on Weighted Voronoi Stippling: ▶ this video
RecommendsView on HN
j
@jarjar22025 · in “Dithering – Part 1”
Two videos from Daniel Shiffman's Coding Train: Turning Images into Dots: The Magic of Dithering link Coding Challenge 181: Weighted Voronoi Stippling ▶ this video
RecommendsView on HN