One of the top reasons I never blog is because I always feel obligated to make images for my blog posts. And then I spend too much time making images. I decided to generate one using JavaScript. It turned out super weird looking but it was fun to make.
Anyway, I used Rough.js in Codepen using Skypack. Rough.js is a nifty library for making canvas and svg graphics with a hand-drawn appearance.
I started with a picture from a vintage cookbook (James Beard's Fireside Cookbook). I added a rough polygon for a background and then some circles as decoration.
It was pretty fun experimenting with different options even if some were pretty hilariously ugly. I call this one "diseased cookies":
Finally I used the regular Canvas browser API to add some text.
If you'd like to play around with it, here is the CodePen I used:
Top comments (1)
cool, thanks. rough.js looks pretty usefull.
Also I have to say, I really like the image you did (the cookbook one). It looks so lively :D