---
title: Gemma Diffusion Website Builder
emoji: 🌐
colorFrom: indigo
colorTo: purple
sdk: gradio
sdk_version: 6.17.3
python_version: "3.12"
app_file: app.py
pinned: false
short_description: Watch a diffusion LLM write a website live, then tweak it
---

# Gemma Diffusion · Live Website Builder

A live, side-by-side visualization of **block-diffusion** code generation. Describe a
website and the model writes a single self-contained HTML document by denoising a canvas
of random tokens — every token position updates *at once* each step.

The left pane shows the raw HTML *canvas* diffusing token-by-token (the signature look of
text diffusion); the right pane renders the page live. Type a follow-up to **tweak in
place**: the previous page seeds the diffusion's starting canvas (via the model's native
`canvas_ids` API), so the model edits the existing page instead of regenerating from
scratch. Changed lines are highlighted, and the preview keeps your scroll position across
re-renders.

## Stack

- **Model**: `google/diffusiongemma-26B-A4B-it` (`DiffusionGemmaForBlockDiffusion`).
- **Backend**: [`gradio.Server`](https://huggingface.co/blog/introducing-gradio-server)
  — a FastAPI subclass that provides Gradio's queue + SSE streaming under a custom,
  hand-written HTML/CSS/JS frontend (`index.html`). The single streaming endpoint
  `/generate` yields one JSON frame per denoising step.
- **Hardware**: ZeroGPU (`xlarge`) — the 26B checkpoint needs the full backing card.

A custom `transformers` wheel providing the DiffusionGemma architecture is bundled in
this repo and installed at runtime by `app.py` (Spaces installs `requirements.txt` before
the repo files are copied in, so a local-path wheel can't be referenced there).

## Configuration

- `HF_TOKEN` (secret) — read access to the private model repo.
- `GRADIO_SSR_MODE=false` (variable) — required so the custom `/` route serves
  `index.html` instead of Gradio's SSR shell.
- `GDIFF_MODEL_PATH` (optional) — override the model repo id.
- `GDIFF_GPU_SIZE` (optional) — ZeroGPU slice, defaults to `xlarge`.