Diagrams.net

Diagrams.net is a great tool for diagramming. I find it vastly superior to Miro, exclusively down to its soothing pastel color palette and selection of line end arrows. Aesthetics aside, taking screen shots, clipping them, sorting them, and updating your post, and once it’s live spotting a spelling mistake…. only to have to do it all over again… it just leaves my crying into my tea.

There must be an easier way!

Can we embed diagrams directly in blog posts?

via GIPHY

Hmmmm…

Yes we can!

With diagrams.net’s handy viewer tool, we can host our diagram and export an IFrame wrapper around the viewer tool to get a nifty embedded diagram.

Dump the diagrams somewhere publicly accessible, I’m using a Diagrams repo

Open your diagram and go to File > Embed > HTML (or an IFrame, but I found you have more control with the HTML side).

Export Html

And dump the link / html into your HTML / markdown.

via GIPHY

Caveat

I still haven’t figured out how to style them properly :)

Credit

Image by Clker-Free-Vector-Images from Pixabay