A font per customer

1. Give each customer some numbers

Let them choose, or derive a starting point from their brand. Keep it to the parameters that move a font a lot:

{
  "company": "Olive & Co",
  "font": { "weight": 90, "contrast": 0.8, "serif": 0.5, "xHeight": 450 }
}

Numbers are all you need to store. The same parameters always draw the same letters, so the font can be made again at any time. See all the parameters.

2. Make the font when you render

const res = await fetch("https://engine.typomat.app/api/v1/fonts", {
  method: "POST",
  headers: {
    Authorization: `Bearer ${process.env.TYPOMAT_KEY}`,
    "Content-Type": "application/json",
  },
  body: JSON.stringify({ name: customer.company, parameters: customer.font }),
});

if (!res.ok) throw new Error((await res.json()).error.message);
const ttf = Buffer.from(await res.arrayBuffer());

3. Keep it for a while

Each call counts against your plan, so hold on to the file while a customer's numbers stay the same. Hash the parameters for the key: when they change, the key changes, and you make a new font.

const key = hash(JSON.stringify(customer.font));
const ttf = (await cache.get(key)) ?? (await makeFont(customer));
await cache.set(key, ttf);

4. Plan for what a font doesn't have

A font holds the characters on the output page. Give your renderer a fallback font, the way a browser has one, so a name with a character outside the set still renders.

Try it

The free trial gives you 100 fonts over 14 days, with no card, which is plenty to build this against.