Great PDFs with Appian

Did you know that you can turn this

<h1>Hello World</h1>

into this

or easily create a great-looking invoice

You’re interested? Follow the white rabbit! Or stay in the matrix, and let’s create great PDF documents together.


Install the HTML-To-PDF plugin on your Appian environment and get to know the documentation of the utilised Java library openhtmltopdf.


You probably know HTML or Hyper Text Markup Language from building websites. If not, induce yourself some web design know-how before reading on.

With HTML, we define the structure of any content displayed on a website. We put text and graphics into various containers, defining hierarchical relationships.

That’s all we need, as we do not use any kind of JavaScript or other fancy stuff.


Using CSS or Cascading Style Sheets, we tell the browser, or the Appian plugin, how to render the HTML content. A lesser known feature of CSS is, that it defines a set of features to specifically support printing of HTML to a paper-like medium like PDF.

Some of these features are:

  • Page layout, margins, and paddings
  • Repeated headers and footers, including automatic page counting
  • Mandatory and optional page breaks, and page break protected sections
  • Repeated headers for multipage tables

And the plugin provides two parameters to define the page size.

This will not turn Appian into Adobe Illustrator, but, like in the invoice example above, makes this method a superior option to other document generators in Appian.

Creating HTML & CSS

To create the required HTML and CSS code, I recommend creating two separate expressions in Appian. The first one creates the CSS, and can be made modular and reusable. The second expression creates the HTML and calls the CSS expression to include any style definitions.

Both expressions use the joinarray() function to return a single string.

    rule!PFX_CreateCss(someParameter: 42),
      "<h1>Hello World</h1>",

Line breaks help to better understand the HTML structure in the output.


This becomes a bit tricky. The plugin does not have access to any graphics stored in Appian. This means that you can include graphics hosted on a public server, or embed them as base64. This makes dynamic images a challenge, but static ones work great. Use any tool to convert your image to base64 and copy the text into an Appian constant.

The HTML to add a base64 encoded image looks like this:

/* Company logo */
"<div style='
  position:absolute; right: 0mm; top: 0mm;
  width: 80mm; height: 60mm; align=right;
  background-image: url(data:image/png;base64,",
  background-size: 30mm;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: right top;

This allows you to position and scale the images as you like.


While the Java library supports SVG for graphics, this is not included in the plugin. Feel free to nag the developer of the plugin to include it.


Here we are, this is, to the best of my knowledge and experience, the best way to create PDF documents in Appian. Have fun and let me hear your feedback.

11 thoughts on “Great PDFs with Appian

  1. hey, I am using this plugin and its working as expected but in some cases it is not working as expected like if we want to convert ordered list in alphabetic, but the plugin makes numbered bullet in pdf.

    1. I am not sure what “type attribute” you mean. I need a bit more details. And, to debug this, did you try to copy the generated HTML into a file and open that in browser? Then you can play around with the HTML and once it works, make the changes in Appian. That would speed up your test cycle a lot.

    1. OK, got it. Mozilla says: “Unless the type of the list number matters (like legal or technical documents where items are referenced by their number/letter), use the CSS list-style-type property instead.” Please, give that a try.

  2. Stefan, this looks great. However, one question if we need to generate a barcode and insert it to this invoice as a image? what approach do you suggest?

  3. Hi Stefan,
    I want to add header to my pdf document format like some text to the most left some text to the most right and some text to the center.

    Is there any option.

Leave a Reply