The Insignificant Pebble

Can I embed png's in Markdown?

Tagged with: markdown, development

To embed or not to embed?

A good image is worth more than a {pick your quantitative value} words. However, when I document something I'd like that document to be self-contained. When it comes to images that might well be an issue, or isn't it?

So in order to still use images, while also embedding them, base64 encoding should be the holy grail. This has a nice side-benefit of forcing you to considder how many images, how big the images are, etc... But first things first, is it even going to work?

To answer that question I figured I'd make this post, on github, and see how it'd render when viewed on github and eventually live on my blog... The markdown is easy enough:

![avatar][img1]

[img1]: data:image/png;base64,.....

Excuse me for wanting to keep this document manageable and cutting the actual base64 out of the code-sample ;) The final result should be showing an image on the next line though:

avatar

Wether this works or not, one should take into account that for every image, your file-size will increase by an amount of kilobytes that quite surpasses the earlier mentioned value in words... So, use with care :)