Skip to content

LiquidPDF

Quote marked as a draft

The template knows nothing about the mark: post.watermark stamps DRAFT across every page after the render, so the reviewed draft and the final quote come from the same template and data. The text is sized to the page diagonal and runs from bottom left to top right. Half a unit on top of the render; /pdf/watermark marks a PDF you rendered earlier.

Free plan, no card. You get your own copy in the editor, published and ready for the API.

Rendered result

Rendered result: Quote marked as a draft
PDF · 1 page · 74 KB ↓ download

What this example shows

  • The template contains no watermark: post.watermark stamps the text across every page after the render, and leaving it out gives the clean quote.
  • The text is sized to the page diagonal and runs from bottom left to top right; color, opacity and rotation change that.
  • Liquid passes helper arguments after a colon: dateAdd: 30, "days" sets the validity, and money prints pounds because the template’s currency is GBP.
  • A PDF that was rendered earlier is marked through /pdf/watermark without rendering it again.
  • Post-processing is part of the Starter plan and above, with a test key too; with a live key each step costs half a unit on top of the render.

Helpers used

Template folder

templates/quote/template.htmlLiquid
<header>
  <p class="brand">{{ company.name }}</p>
  <p class="muted">{{ company.street }} · {{ company.city }}</p>
</header>

<h1>Quote {{ quote.number }}</h1>
<p class="muted">
  For {{ customer.name }} · issued {{ quote.date | date: "d MMMM yyyy" }} ·
  valid until {{ quote.date | dateAdd: 30, "days" | date: "d MMMM yyyy" }}
</p>

<table>
  <thead>
    <tr><th>Item</th><th class="num">Qty</th><th class="num">Rate</th><th class="num">Amount</th></tr>
  </thead>
  <tbody>
    {% for line in quote.lines %}
    <tr>
      <td>{{ line.description }}</td>
      <td class="num">{{ line.qty }}</td>
      <td class="num">{{ line.price | money }}</td>
      <td class="num">{{ line.total | money }}</td>
    </tr>
    {% endfor %}
  </tbody>
  <tfoot>
    <tr><td colspan="3">Total</td><td class="num">{{ quote.lines | sum: "total" | money }}</td></tr>
  </tfoot>
</table>

<p class="notes">{{ quote.notes }}</p>
templates/quote/style.cssCSS
body { font-family: 'Inter', sans-serif; font-size: 10pt; color: #1e293b; }
header { padding-bottom: 6mm; border-bottom: 1px solid #e2e8f0; }
.brand { margin: 0; font-size: 14pt; font-weight: 700; color: #0f766e; }
.muted { margin: 1mm 0 0; color: #64748b; }
h1 { margin: 14mm 0 2mm; font-size: 22pt; }
table { width: 100%; margin-top: 10mm; border-collapse: collapse; }
th { padding: 2mm 1.5mm; border-bottom: 1.5px solid #1e293b; text-align: left; font-size: 8pt; text-transform: uppercase; color: #64748b; }
td { padding: 2.5mm 1.5mm; border-bottom: 1px solid #e2e8f0; }
tfoot td { border-top: 1.5px solid #1e293b; border-bottom: 0; font-weight: 700; font-size: 12pt; }
.num { text-align: right !important; white-space: nowrap; }
.notes { margin-top: 10mm; font-size: 8.5pt; color: #64748b; }
templates/quote/head.htmlHTML
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap">
templates/quote/settings.jsonJSON
{
  "pdf": {
    "metadata": {
      "title": "Quote {{ quote.number }}"
    }
  },
  "paper": {
    "format": "A4"
  },
  "margin": {
    "top": "22mm",
    "right": "20mm",
    "bottom": "22mm",
    "left": "20mm"
  },
  "locale": "en-GB",
  "currency": "GBP"
}
templates/quote/data/default.jsonJSON
{
  "company": {
    "name": "Fennlor Studio Ltd",
    "street": "1 Example Street",
    "city": "Exampletown"
  },
  "customer": {
    "name": "Olvarest Ltd"
  },
  "quote": {
    "number": "Q-2026-017",
    "date": "2026-09-10",
    "lines": [
      {
        "description": "Discovery workshop",
        "qty": 2,
        "price": 950,
        "total": 1900
      },
      {
        "description": "Design system",
        "qty": 1,
        "price": 6400,
        "total": 6400
      },
      {
        "description": "Front-end build (days)",
        "qty": 12,
        "price": 720,
        "total": 8640
      }
    ],
    "notes": "Prices exclude VAT. Travel is billed at cost."
  }
}

Render it through the API

Save the sample data as data.json and send it with the template’s name. TypeScript and Python use the SDKs; every other language posts the same JSON to the REST API with its standard library. Post-processing needs the Starter plan or above: the Free plan answers 403, with a test key as well. Renders with a key that starts with ff_test_ are not metered.

render.shShell
jq '{template: "quote", data: ., post: {watermark: {text: "DRAFT"}}}' data.json \
  | curl https://api-eu.formfeed.dev/v1/renders \
      -H "Authorization: Bearer ff_live_..." \
      -H "Content-Type: application/json" \
      --data-binary @-
render.tsTypeScript
import { Formfeed } from '@formfeed/sdk';
import data from './data.json' with { type: 'json' };

const formfeed = new Formfeed({ apiKey: process.env.FORMFEED_API_KEY! });

const render = await formfeed.renders.create({
  template: 'quote',
  data,
  post: {
    watermark: { text: 'DRAFT' },
  },
});
console.log(render.status, render.download_url);
render.pyPython
import json
import os

from formfeed import Formfeed

formfeed = Formfeed(api_key=os.environ["FORMFEED_API_KEY"])

with open("data.json", encoding="utf-8") as file:
    data = json.load(file)

render = formfeed.renders.create(
    template="quote",
    data=data,
    post={
        "watermark": {"text": "DRAFT"},
    },
)
print(render.status, render.download_url)
render.phpPHP
<?php
$body = [
    'template' => 'quote',
    'data' => json_decode(file_get_contents('data.json'), true),
    'post' => [
        'watermark' => ['text' => 'DRAFT'],
    ],
];

$curl = curl_init('https://api-eu.formfeed.dev/v1/renders');
curl_setopt_array($curl, [
    CURLOPT_POST => true,
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_HTTPHEADER => [
        'Authorization: Bearer ' . getenv('FORMFEED_API_KEY'),
        'Content-Type: application/json',
    ],
    CURLOPT_POSTFIELDS => json_encode($body),
]);
$render = json_decode(curl_exec($curl), true);

echo $render['status'], ' ', $render['download_url'], PHP_EOL;
main.goGo
package main

import (
	"bytes"
	"encoding/json"
	"fmt"
	"net/http"
	"os"
)

func main() {
	data, err := os.ReadFile("data.json")
	if err != nil {
		panic(err)
	}
	body, _ := json.Marshal(map[string]any{
		"template": "quote",
		"data":     json.RawMessage(data),
		"post": map[string]any{
			"watermark": map[string]any{"text": "DRAFT"},
		},
	})

	request, _ := http.NewRequest("POST", "https://api-eu.formfeed.dev/v1/renders", bytes.NewReader(body))
	request.Header.Set("Authorization", "Bearer "+os.Getenv("FORMFEED_API_KEY"))
	request.Header.Set("Content-Type", "application/json")

	response, err := http.DefaultClient.Do(request)
	if err != nil {
		panic(err)
	}
	defer response.Body.Close()

	var render struct {
		Status      string `json:"status"`
		DownloadURL string `json:"download_url"`
	}
	json.NewDecoder(response.Body).Decode(&render)
	fmt.Println(render.Status, render.DownloadURL)
}
Program.csC#
using System.Net.Http.Headers;
using System.Net.Http.Json;
using System.Text.Json;

var body = new
{
    template = "quote",
    data = JsonDocument.Parse(File.ReadAllText("data.json")).RootElement,
    post = new {
        watermark = new { text = "DRAFT" },
    },
};

using var http = new HttpClient();
http.DefaultRequestHeaders.Authorization =
    new AuthenticationHeaderValue("Bearer", Environment.GetEnvironmentVariable("FORMFEED_API_KEY"));

var response = await http.PostAsJsonAsync("https://api-eu.formfeed.dev/v1/renders", body);
var render = await response.Content.ReadFromJsonAsync<JsonElement>();

Console.WriteLine($"{render.GetProperty("status")} {render.GetProperty("download_url")}");
Render.javaJava
import java.net.URI;
import java.net.http.HttpClient;
import java.net.http.HttpRequest;
import java.net.http.HttpResponse;
import java.nio.file.Files;
import java.nio.file.Path;

public class Render {
  public static void main(String[] args) throws Exception {
    String data = Files.readString(Path.of("data.json"));
    String body = """
        {
          "template": "quote",
          "post": {"watermark":{"text":"DRAFT"}},
          "data": %s
        }
        """.formatted(data);

    HttpRequest request = HttpRequest.newBuilder(URI.create("https://api-eu.formfeed.dev/v1/renders"))
        .header("Authorization", "Bearer " + System.getenv("FORMFEED_API_KEY"))
        .header("Content-Type", "application/json")
        .POST(HttpRequest.BodyPublishers.ofString(body))
        .build();

    HttpResponse<String> response = HttpClient.newHttpClient().send(request, HttpResponse.BodyHandlers.ofString());
    System.out.println(response.body()); // status, download_url, page_count, units …
  }
}
render.rbRuby
require "json"
require "net/http"

body = {
  template: "quote",
  data: JSON.parse(File.read("data.json")),
  post: {
    watermark: { text: "DRAFT" },
  },
}

response = Net::HTTP.post(
  URI("https://api-eu.formfeed.dev/v1/renders"),
  JSON.generate(body),
  "Authorization" => "Bearer #{ENV.fetch("FORMFEED_API_KEY")}",
  "Content-Type" => "application/json"
)
render = JSON.parse(response.body)

puts render["status"], render["download_url"]

More ways to call it

TypeScript
// mark a PDF you already rendered, without rendering it again
const marked = await formfeed.pdf.watermark(render, {
  text: 'SUPERSEDED',
  color: '#b91c1c',
  opacity: 0.15,
});

Start rendering today

The free plan includes 100 units a month and free test renders. Change plans when you need more.