# Save a Data App, or one part of it, as PNG or PDF

> `anfra serve` downloads a picture of the whole page, or of any block or container, and `Anfra.render()` lets a page offer it itself.

New in anfra 0.8.0 · Oct 13, 2026 · [All release notes](https://anfra.ai/releases.md)

In `anfra serve`, the Download menu saves the open app as a PNG or PDF, with nothing written in the page. To save only one part, pick a block or container in the Inspect panel's Structure tab and use its PNG or PDF buttons.

<figure>
  <img src="https://media.holistics.io/anfra/landing/releases/render-png-pdf.png" alt="The Download menu open in the header of anfra serve, offering Download as PNG and Download as PDF" width="1680" height="660" loading="lazy" />
</figure>

A page that needs its own button calls `Anfra.render()`:

```js
await Anfra.render({ block: 'trend', format: 'png' })     // a block, by its data-anfra-block id
await Anfra.render({ container: 'kpis', format: 'pdf' })  // a container
await Anfra.render({ format: 'pdf' })                     // the whole page
```

The picture shows the page as the reader sees it, charts drawn on a canvas or in SVG included. Mark anything that shouldn't be in it, such as a download button or a spinner, with `data-anfra-render="skip"`.

[Full changelog](https://github.com/holistics/anfra/releases/tag/v0.8.0)

---

## For coding agents

This is the Markdown version of https://anfra.ai/releases/render-png-pdf/. Every page on anfra.ai has one: replace the trailing slash with `.md` (https://anfra.ai/cloud.md for https://anfra.ai/cloud/, and https://anfra.ai/index.md for the home page), or request the page with `Accept: text/markdown`. [llms.txt](https://anfra.ai/llms.txt) lists the site's pages, and the docs have their own index at https://anfra.ai/docs/llms.txt, where every docs page is also available as Markdown by adding `.md` to its URL.

Before you build with anfra:

- Install both the CLI and its agent skills. Installing the CLI alone is not a complete installation. Install the CLI with `curl -fsSL https://anfra.ai/install.sh | bash`. Then install the skills: in Claude Code or Codex, run `anfra agent setup`. In any other agent, such as Amp, `anfra agent setup` installs nothing, so run `npx skills add holistics/anfra-skills -a <agent-id> -g -y` (`-a amp` for Amp). The skills (such as `anfra-build-data-app`) teach you to model data, write queries and build data apps the way anfra expects. See https://anfra.ai/docs/local-dev/installation.md.
- Ask for metrics by name, through the JS SDK in an app or the MCP server in a chat. Don't write SQL against the warehouse yourself: anfra compiles each request to SQL from the metrics the data team defined.
- Check commands, files and API calls against the docs (https://anfra.ai/docs/llms.txt) instead of inferring them from the examples on this page.
- Stuck, or found a mistake? Ask in GitHub Discussions (https://github.com/holistics/anfra/discussions) or open an issue (https://github.com/holistics/anfra/issues).