Welcome

Preview App

About this App

The PDFreactor Preview Application can display preview renderings of what HTML documents will look like after conversion to PDF using PDFreactor.

It may be used as a design tool to help create page layouts.

What's new in 10?

Improved Flexible Box Layout

CSS Page Groups

Color Space Conversion

Segmentation

Sample Documents

This document showcases several use case and technical samples that demonstrate some key features of PDFreactor.

Every example has a short description with basic information. Click on the description to open the example.

Use Case Samples

Science Magazine

A magazine article layout using regions to achieve a text flow through freely positioned boxes across pages.

  • Regions
  • Web Fonts
  • Page-filling Background Images
  • Semitransparent backgrounds
  • Text Shadow
  • @supports Rule

Page size: A4

Daily Newspaper

The front page of a newspaper, complete with multi-column layouts and headings that span these columns.

  • Multi-column Layout
  • Web Fonts
  • Barcode
  • CSS Variables
  • Numeric Font Weight

Page size: 325mm × 480mm

Tourist Brochure

A brochure trifold ready for printing, using spot colors with CMYK fallback colors as well as CMYK TIFF images. Oversized pages provides space for bleed areas and printer marks.

  • Spot & CMYK Colors
  • CMYK TIFF Images
  • Oversized Page Sizes
  • PDF Page Boxes & Printer Marks
  • Web Fonts
  • Transforms

Page size: A4

Corporate Invoice

An invoice sheet that uses AngularJS to populate a template from a JSON source and performs calculations.

  • AngularJS
  • Templating
  • Localized Dates, Numbers & Currencies
  • Subtotal Insertion
  • 2D Barcode

Page size: A4

Textbook

A textbook layout that demonstrates basic page layout features like page headers and footers with page numbers and chapter titles while explaining them.

  • Page Headers & Page Counters
  • First, Last & Named Pages
  • Page Groups
  • Running Table Headers
  • Gradients
  • Text & Box Shadow

Page Size: A4

Children's Novel

A classic novel layout with a table of contents generated via JavaScript.

  • Table of Contents
  • Spelled-out Chapter Numbers
  • First-letter Drop Caps
  • Left, Right & Blank Pages
  • Automatic Hyphenation
  • 150+ Pages of Content

Page size: letter

Technical Documentation

Presents CSS designed to display W3C documents.

  • Cross-references
  • Website as Print
  • Hyperlinks

Page size: A4

Official Form

An HTML and CSS reproduction of a complex form, i.e. the official W-8BEN form used by non-US entities to certify their US tax withholding status.

  • Complex Layout
  • Styled Interactive Forms

Page Size: letter

Mortgage Calculation

A business document that uses features like PDF comments to add information to the PDF for further processing and running elements to use HTML content in page headers and footers. The canvas elements with charts are embedded into the resulting PDFs as vector graphics.

  • PDF Comments
  • Running Elements
  • Canvas Charts
  • SVG Images

Page size: legal

Technical Samples

Flexbox

A demonstration of how flexible box layout can be used to arrange multiple items inside containers, let them flow in rows or columns and how they interact with page breaks.

  • Flexbox

Page size: A4

Regions

A demonstration of the regions layout feature. Includes various use cases, e.g. positioning regions around images and into shapes.

  • Regions
  • Automatic Hyphenation

Page size: A4

Multi-Column

A demonstration of the multi-Column layout feature. Includes various use cases, e.g. a dictionary or a restaurant menu.

  • Multi-column
  • Column Spanning Elements
  • Automatic Hyphenation
  • Baseline Grids

Page size: A4

Accessibility

Demonstrates how to create accessible and archivable PDF/UA and PDF/A documents.

  • Tagging
  • PDF/A-3a
  • PDF/UA-1

Page size: A4

International

This document demonstrates the rendering capabilities of different writing systems and Unicode characters.

  • Bi-directional Text
  • Mixed Content
  • Automatic Arabic Shaping

Page size: A4

Footnotes

Demonstrates the usage of CSS3 footnotes in HTML documents.

  • Footnotes

Page size: A4

Styled Forms

Demonstrates HTML forms and interactive PDF forms (sometimes referred to as AcroForms) capabilities of PDFreactor.

  • HTML & PDF Forms
  • Styled Forms
  • Automatically Resized Text Areas

Page size: letter

Compound Formats

Demonstrate how to add various compound formats to your PDFs.

  • Bar Codes & 2D Bar Codes
  • QR Codes
  • SVG Images
  • MathML Formulas
  • PDFs as Images

Page size: A4

JavaScript

Illustrates tables, graphs and charts in the style of scientific reports. Uses the Open Source JavaScript library "flotr2" as well as "awesomizr.js" which is included with PDFreactor.

  • Manipulating HTML using JavaScript
  • Using JavaScript Libraries
  • Canvas
  • Native Transforms and Gradients
  • PDF Pages as Iterable Images

Page size: letter

Bookmarks

Demonstrates how to create PDF Bookmarks.

  • PDF Bookmarks

Page size: A4

Comments

Demonstrates how to create PDF Comments.

  • PDF Comments

Page size: A4