console.log can also be styled! It's a restricted subset of css so you have to hack around it, but it's good enough to make images display: img = $$('img')[0

console.log can also be styled! It's a restricted subset of css so you have to hack around it, but it's good enough to make images display: img = $$('img')[0]; // console.log(img); console.log("%cPlaceholder", `background:url("${img.src}") no-repeat cyan; border:1px solid black; padding:${img.naturalHeight}px ${img.naturalWidth}px 0 0; font-size:0; line-height:0;`); If you paste this you should see the HN logo display in your console. Credit for the image trick goes to https://github.com/adriancooney/console.image https://github.com/adriancooney/console.image I use this a lot for working with animated canvases. Appending the current frame into the page is not the same since you lose the context you get from being interleaved with your other log messages.