html2pdf.it - HTML5, CSS3 and JavaScript supported.


Web pages as PDF

Web page

The pdf will be made as when you print a web page to a printer. Some web pages have not been optimized for printing and will not look pretty


HTML5 and CSS3

HTML and CSS is interpreted by the WebKit rendering engine, also used in Chrome, Safari and Opera.

JavaScript

JavaScript on the page is run as if in a browser.

Open source

html2pdf.it is open source, take a look at the code. Fork it and run your own html2pdf.it server.

Build with node.js

The technology used is node.js. Run your own server on either Ubuntu, Mac or Windows

Nothing to install

If you do not want to install and run your own servers, you are welcome to use html2pdf.it directly www.html2pdf.it/?url=[url].

If the traffic ramps up to cost me a lot of money, this may turn into a paid service, or require donations. Running your own server will always be free.

Use it in your web application

A good use for html2pdf.it is to use it as a service in your own web application or phone app etc.

You could for example turn your HTML invoices into PDFs, before sending the to your customers.

Querystring parameters

parameter possible values description
url URL (required) The URL of the web page you want to turn into a pdf
format A3 | A4 | A5 | Legal | Letter | Tabloid The page format of the pdf generated
margin 0cm | 1cm | 2cm | 1in | 13mm The margin of the pdf generated in the form [0-99][cm|mm|in]
orientation portrait | landscape The page orientation of the pdf generated
download true | false If set to true the request for the pdf will get the HTTP header Content-disposition set. Causing the browser to download the file instead of opening it
filename name of pdf file downloaded If set, this will be then name of the pdf file. If not set, the filename will be the url passed (slugified).

Headers & footers

You add headers and footers to the PDF by inserting a script in the HTML of the web page. Below is an example with page numbers in footer and header. NOTE: You have to control the web page and modify it by inserting this script.

<script type="text/javascript">
//setting up headers and footers for html2pdf
var html2pdf = {
 header: {
  height: "1cm",
  contents: '<div class="center">page {{pageNumber}} of {{totalPages}}</div>'
 },
 footer: {
  height: "1cm",
  contents: '<div class="center">page {{pageNumber}} of {{totalPages}}</div>'
  }
 }
};
</script>
{{pageNumber}} will be replaced with 1 on page 1, replaced with 2 on page 2 and so on. {{totalPages}} will be replaced by the total count of pages in the PDF.


Fork me on GitHub