Revecto

Multi-page report

A Forme report whose table runs over several pages.

A table long enough for three pages, with a <thead> repeated on every page, rows kept whole with break-inside: avoid, an appendix starting on a new page with break-before: page, and the title and "Page X of Y" in @page margin boxes.

HTML

Save the document as report.html.

report.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Sales report 2026</title>
<style>
  @page {
    margin: 25mm 18mm;

    @top-center {
      content: "Acme Corp sales report 2026";
      font-family: Helvetica;
      font-size: 9pt;
      color: #6b7280;
    }

    @bottom-center {
      content: "Page " counter(page) " of " counter(pages);
      font-family: Helvetica;
      font-size: 9pt;
      color: #6b7280;
    }
  }

  body {
    font-family: Helvetica;
    font-size: 10pt;
    color: #111827;
  }

  h1 {
    font-size: 20pt;
    margin-top: 0;
  }

  table {
    width: 100%;
    border-collapse: collapse;
  }

  th {
    text-align: left;
    background-color: #f3f4f6;
    padding: 2mm;
  }

  td {
    padding: 3.5mm 2mm;
    border-bottom: 1px solid #e5e7eb;
  }

  tr {
    break-inside: avoid;
  }

  .num {
    text-align: right;
  }

  .appendix {
    break-before: page;
  }
</style>
</head>
<body>
  <h1>Sales report 2026</h1>
  <p>Units sold and revenue per month and region.</p>

  <table>
    <thead>
      <tr><th>Month</th><th>Region</th><th class="num">Units</th><th class="num">Revenue</th></tr>
    </thead>
    <tbody>
      <tr><td>Jan 2026</td><td>North</td><td class="num">120</td><td class="num">$2,880</td></tr>
      <tr><td>Jan 2026</td><td>South</td><td class="num">157</td><td class="num">$3,768</td></tr>
      <tr><td>Jan 2026</td><td>East</td><td class="num">194</td><td class="num">$4,656</td></tr>
      <tr><td>Jan 2026</td><td>West</td><td class="num">231</td><td class="num">$5,544</td></tr>
      <tr><td>Feb 2026</td><td>North</td><td class="num">268</td><td class="num">$6,432</td></tr>
      <tr><td>Feb 2026</td><td>South</td><td class="num">125</td><td class="num">$3,000</td></tr>
      <tr><td>Feb 2026</td><td>East</td><td class="num">162</td><td class="num">$3,888</td></tr>
      <tr><td>Feb 2026</td><td>West</td><td class="num">199</td><td class="num">$4,776</td></tr>
      <tr><td>Mar 2026</td><td>North</td><td class="num">236</td><td class="num">$5,664</td></tr>
      <tr><td>Mar 2026</td><td>South</td><td class="num">273</td><td class="num">$6,552</td></tr>
      <tr><td>Mar 2026</td><td>East</td><td class="num">130</td><td class="num">$3,120</td></tr>
      <tr><td>Mar 2026</td><td>West</td><td class="num">167</td><td class="num">$4,008</td></tr>
      <tr><td>Apr 2026</td><td>North</td><td class="num">204</td><td class="num">$4,896</td></tr>
      <tr><td>Apr 2026</td><td>South</td><td class="num">241</td><td class="num">$5,784</td></tr>
      <tr><td>Apr 2026</td><td>East</td><td class="num">278</td><td class="num">$6,672</td></tr>
      <tr><td>Apr 2026</td><td>West</td><td class="num">135</td><td class="num">$3,240</td></tr>
      <tr><td>May 2026</td><td>North</td><td class="num">172</td><td class="num">$4,128</td></tr>
      <tr><td>May 2026</td><td>South</td><td class="num">209</td><td class="num">$5,016</td></tr>
      <tr><td>May 2026</td><td>East</td><td class="num">246</td><td class="num">$5,904</td></tr>
      <tr><td>May 2026</td><td>West</td><td class="num">283</td><td class="num">$6,792</td></tr>
      <tr><td>Jun 2026</td><td>North</td><td class="num">140</td><td class="num">$3,360</td></tr>
      <tr><td>Jun 2026</td><td>South</td><td class="num">177</td><td class="num">$4,248</td></tr>
      <tr><td>Jun 2026</td><td>East</td><td class="num">214</td><td class="num">$5,136</td></tr>
      <tr><td>Jun 2026</td><td>West</td><td class="num">251</td><td class="num">$6,024</td></tr>
      <tr><td>Jul 2026</td><td>North</td><td class="num">288</td><td class="num">$6,912</td></tr>
      <tr><td>Jul 2026</td><td>South</td><td class="num">145</td><td class="num">$3,480</td></tr>
      <tr><td>Jul 2026</td><td>East</td><td class="num">182</td><td class="num">$4,368</td></tr>
      <tr><td>Jul 2026</td><td>West</td><td class="num">219</td><td class="num">$5,256</td></tr>
      <tr><td>Aug 2026</td><td>North</td><td class="num">256</td><td class="num">$6,144</td></tr>
      <tr><td>Aug 2026</td><td>South</td><td class="num">293</td><td class="num">$7,032</td></tr>
      <tr><td>Aug 2026</td><td>East</td><td class="num">150</td><td class="num">$3,600</td></tr>
      <tr><td>Aug 2026</td><td>West</td><td class="num">187</td><td class="num">$4,488</td></tr>
      <tr><td>Sep 2026</td><td>North</td><td class="num">224</td><td class="num">$5,376</td></tr>
      <tr><td>Sep 2026</td><td>South</td><td class="num">261</td><td class="num">$6,264</td></tr>
      <tr><td>Sep 2026</td><td>East</td><td class="num">298</td><td class="num">$7,152</td></tr>
      <tr><td>Sep 2026</td><td>West</td><td class="num">155</td><td class="num">$3,720</td></tr>
      <tr><td>Oct 2026</td><td>North</td><td class="num">192</td><td class="num">$4,608</td></tr>
      <tr><td>Oct 2026</td><td>South</td><td class="num">229</td><td class="num">$5,496</td></tr>
      <tr><td>Oct 2026</td><td>East</td><td class="num">266</td><td class="num">$6,384</td></tr>
      <tr><td>Oct 2026</td><td>West</td><td class="num">123</td><td class="num">$2,952</td></tr>
      <tr><td>Nov 2026</td><td>North</td><td class="num">160</td><td class="num">$3,840</td></tr>
      <tr><td>Nov 2026</td><td>South</td><td class="num">197</td><td class="num">$4,728</td></tr>
      <tr><td>Nov 2026</td><td>East</td><td class="num">234</td><td class="num">$5,616</td></tr>
      <tr><td>Nov 2026</td><td>West</td><td class="num">271</td><td class="num">$6,504</td></tr>
      <tr><td>Dec 2026</td><td>North</td><td class="num">128</td><td class="num">$3,072</td></tr>
      <tr><td>Dec 2026</td><td>South</td><td class="num">165</td><td class="num">$3,960</td></tr>
      <tr><td>Dec 2026</td><td>East</td><td class="num">202</td><td class="num">$4,848</td></tr>
      <tr><td>Dec 2026</td><td>West</td><td class="num">239</td><td class="num">$5,736</td></tr>
    </tbody>
  </table>

  <section class="appendix">
    <h2>Appendix: method</h2>
    <p>Units are counted when an order ships. Revenue is units times the list price of $24.</p>
  </section>
</body>
</html>

Request

Each sample reads report.html and saves the PDF as report.pdf. The cURL sample builds the JSON body with jq.

jq -n --rawfile html report.html \
  '{ engine: "forme", html: $html, options: { paper_size: "A4" } }' \
  | curl https://api.eu.revecto.dev/v1/convert \
    -H "Authorization: Bearer $REVECTO_API_KEY" \
    -H "Content-Type: application/json" \
    --data-binary @- \
    --fail-with-body \
    -o report.pdf

Result

Multi-page report, first page

Download the PDF

See also: Page setup, Forme.

On this page