Beautiful PDFs from HTML

This page summarizes the projects mentioned and recommended in the original post on news.ycombinator.com

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • pdf

    Tutorial on paged.js

  • Hi dang, hope you are well. May I kindly ask why not? I spent two weeks writing the CSS / HTML / JavaScript, and did well documented code - in fact the output serves as both documentation of the code and also output from it (in my own stupid way, I was thinking I was following Donald Knuth’s Literate Programming Approach :D).

    The repo (https://github.com/ashok-khanna/pdf) contains all the necessary code and is intended for others to reuse in their projects. Some of it isn’t straightforward, despite the guide looking easy - I had to figure out how CSS selectors and counters work for example, how MathJax interacted with Paged.Js.

    I think the confusion comes from it being labeled as a “guide”, in fact it’s a full set of code to give the required functionality for high quality PDFs from HTML, using paged.js, the guide is just the self documentation as I figured I might as well use documentation for the sample output. Otherwise, I’d be genuinely curious on what constitutes Show HN vs normal posts?

    I think the repo description and the way the output is confusing / unclear - the primary goal is very much meant to be a code base for people to reuse as I’ve noticed for many programmers, the design side can be a bit more elusive.

    Separately, would it be possible to add beautiful back to the title - it’s not really about producing PDFs from html as browsers can already do that, and there are many other tools. The main aim is to have the functionality to produce very high quality typeset PDFs from HTML, which until now, I only felt PrinceXML did well and that’s a paid solution. Maybe we could say the title is “High quality PDFs from HTML using Paged.JS”? I know there has been a separate discussion on another thread on the overuse of the word beautiful in describing code - my view is that it has its place when it relates to output / UI.

    Thanks for reading, and no issues otherwise (no need to reply).

  • pagedown

    Paginate the HTML Output of R Markdown with CSS for Print

  • I use pagedown all the time.

    https://pagedown.rbind.io/

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • ReLaXed

    Create PDF documents using web technologies

  • A few years ago I started an alternative to PrinceXML called ReLaXed.js [1], it's always been sufficient for my reports but it may lack some pagination/layout features that Paged.js may have as they seem to have given this much more thoughts (still wrapping my head around whether paged.js could be "plugged into" Relaxed).

    [1] https://github.com/RelaxedJS/ReLaXed

  • markdeep-thesis

    Write your (under)graduate thesis with Markdeep and typeset it right in your browser.

  • There's also Bindery, a JavaScript library for book creation: https://evanbrooks.info/bindery/

    On top of it and the in-browser Markdown renderer Markdeep, I've built a tool for typesetting undergraduate theses: https://github.com/doersino/markdeep-thesis/

    And, coincidentally, I've written a blog post about controlling the settings in Chrome's "Print" dialogue with CSS just a few days ago (other browsers don't support many of the relevant features): https://excessivelyadequate.com/posts/print.html

  • pandoc

    Universal markup converter

  • aviraldg

  • (Somewhat) related self-promotion: I've found that converting from HTML(+YAML) to PDF is one of the best ways to create a resume. It's very easy to come up with a good design, you can separate data (YAML) and presentation (HTML and CSS), and also export different views over the underlying data with simple filters (e.g. when generating a resume to apply to a job, only include the experiences that are relevant)

    The code is pretty terrible, but you can see an example (my resume) here:

    * Data - https://github.com/aviraldg/aviraldg.github.io/blob/master/_...

    * HTML - https://github.com/aviraldg/aviraldg.github.io/blob/master/r...

  • MathJax

    Beautiful and accessible math in all browsers

  • Hi, Adam here from Pagedjs. Pagedjs is MIT. Mathjax is Apache 2.0 and isn't part of our work :) Wonderful as it is...we can't claim credit for it! (We Love MathJax - https://github.com/MathJax/MathJax)

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
  • breezy-pdf-lite

    HTML/CSS/JS in, PDF out, via Chrome

  • I built, use, and maintain https://github.com/danielwestendorf/breezy-pdf-lite which uses Chrome to convert html to PDF’s as a web service. Maybe someone here will find it useful!

  • asciidoctor-web-pdf

    Convert AsciiDoc documents to PDF using web technologies

  • Asciidoctor has a web PDF tool that just went alpha a little bit ago, uses the same stack as the OP's thingie.

    https://github.com/Mogztter/asciidoctor-web-pdf

    The content handoff goes like this: Asciidoc (using defined roles) generates HTML5 (Pagedjs polyfills page areas / pagination stuff), CSS styles stuff, and Puppeteer runs a headless Chromium for the pdf render. It's straight from CSS GCPM W3C spec, a flavor of CSS Paged Media, drafts that have been percolating since frickin' 2006 but have never seen browser implementation.

  • WeasyPrint

    The awesome document factory

  • Yeah, in the Python world there's WeasyPrint for PDF out in the wild as well. It's quite slick, but it's a harder sell because of Python, which corporate types seem to think is bad hacker central.

    https://github.com/Kozea/WeasyPrint

  • SingleFile

    Web Extension for saving a faithful copy of a complete web page in a single HTML file

  • Regarding a library of HTML documents: https://github.com/gildas-lormeau/SingleFile#install

  • SnappySnippet

    Chrome extension that allows easy extraction of CSS and HTML from selected element.

  • Somehow related: I find Snappy Snippet extension (for Chrome) very interesting. It's supposed to let you make a "live" screenshot of a DOM element. Unfortunately, I've not tried it much as I only rely on Firefox in day to day browsing.

    https://github.com/kdzwinel/SnappySnippet

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts