jonz94/convert-html-to-png-using-html2canvas.md

Created February 24, 2020 12:45

Star (0) You must be signed in to star a gist
Fork (0) You must be signed in to fork a gist

Select an option

Learn more about clone URLs
Clone this repository at <script src="https://gist.github.com/jonz94/82a5158cd163fbac4da74e4fca15f0ad.js"></script>
Save jonz94/82a5158cd163fbac4da74e4fca15f0ad to your computer and use it in GitHub Desktop.

Download ZIP

Raw

convert-html-to-png-using-html2canvas.md

Open html file with broswer
Open console, paste following code snippet

let base64png;

fetch('https://html2canvas.hertzen.com/dist/html2canvas.min.js')
  .then(response => response.text())
  .then(text => eval(text))
  .then(() => html2canvas(document.body))
  .then(canvas => (base64png = canvas.toDataURL()))
  .then(() => console.log('finish!'))
  .catch(error => console.log('failed, error detail: ', error));

Copy value of base64png into clipboard by typing:

copy(base64png);

Go to https://onlinepngtools.com/convert-base64-to-png, paste the value of base64png, and download png file 🎉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment