Doodles in Markdown

This website is powered by a self-written bit of software that converts markdown, typescript and scss into html, javascript and css. In the markdown convertor, I've extended it to support the ability to draw doodles via Rough.js.

Rough.js is a tool that can draw basic shapes to either Canvas or SVG elements. I've opted to generate the doodles via SVG elements so they can be baked directly into the generated HTML pages.

This is acheived by intercepting a markdown code block with the "doodle" language. The markdown to html conversion emits embedded SVG instead of the code block.

For example, we can draw an arrow and a polygon:

```doodle
arrow -50 0 0 0 red
polygon 50 0 100 50 100 100 0 100 green
```

Which results in generating the following doodle.

It is also possible to include a simple SVG and have it rendered in the doodle style. This is accomplished by using markdown image syntax where the path points to a file with a .svg!doodle extension.

Note: This does not support many SVG features, only simple shapes and solid colors.

Here is the same SVG above, but included without the doodle style: