# Render a card from Python

URL: https://lbliii.github.io/chirp-ui/notebook/render-a-card-from-python/
Section: notebook
Description: A short executable note showing how a chirp-ui macro renders to HTML.

---

> For a complete page index, fetch https://lbliii.github.io/chirp-ui/llms.txt.

## Set up the environment

We import the Kida environment and the chirp-ui loader so macros resolve from
the packaged templates.

```python
from kida import Environment
from chirp_ui import get_loader, register_filters

env = Environment(loader=get_loader())
register_filters(env)
```

## Render a card

Calling the `card` macro returns plain HTML — no build step, no client bundle.

```python
template = env.from_string(
    '{% from "chirpui/card.html" import card %}'
    '{% call card(title="Welcome") %}<p>Server-rendered.</p>{% end %}'
)
print(template.render())
```

```text
<article class="chirpui-card">
  <header class="chirpui-card__header">
    <span class="chirpui-card__title">Welcome</span>
  </header>
  <div class="chirpui-card__body"><p>Server-rendered.</p></div>
</article>
```

## Why this matters

The same macro renders identically inside a notebook, a Bengal page, or a Chirp
route. The notebook layout above summarizes the kernel and language in a metric
grid, then renders this body — a stand-in until Bengal exposes structured
`params.notebook.cells` for a per-cell code/output/exec-count renderer.
