Skip to main content

Command Palette

Search for a command to run...

Designing Cal Bureau: The lessons I learned building a minimal printable asset engine

Updated
2 min read
L
Serial Maker. Building 15 tools.

I recently launched Cal Bureau, a free directory for printable calendars, trackers, and planner pages. While the project sounds simple on the surface, the process of building a system to generate clean, scalable, and cross-region friendly printables taught me a lot about print-oriented web design.https://calbureau.com

Here are the key takeaways from building Cal Bureau in public.

Don't trust conversion libraries for typography

Originally, I tried using standard HTML-to-PDF server libraries. However, rendering custom fonts and precise vector borders often failed, resulting in misaligned layout boxes. Using headless Playwright to handle the rendering via Chromium's native print engine solved 99% of my layout headaches. If your browser renders it perfectly, your PDF will look exactly the same.

CSS Grid is a lifesaver for calendar layouts

Designing a calendar grid that dynamically stretches to fill both portrait and landscape orientation without breaking borders can be nightmare-inducing with tables or flexbox. CSS Grid makes this trivial:

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-template-rows: auto repeat(5, 1fr);
}

This ensures that whether it is rendered on A4 or US Letter, the grid cells automatically scale to fill the page margins.

The focus is on the UX of downloading

Most printable directories force users through multi-step onboarding forms or ad-heavy click loops. With Cal Bureau, I wanted to prove that a side project can gain traction by offering direct utility. No emails, no logins, no dark patterns. You choose a layout, preview it, and hit download.

I would love to get your feedback on the current templates and the overall UI. What features or planner designs would make this a daily bookmark for you?