---

license: apache-2.0

library_name: llama.cpp

pipeline_tag: image-text-to-text

base_model: wesjos/mario-html-v2-4B

language:

• en
• zh

tags:

• gguf
• html-generation
• web-design
• visual-ui
• visual-question-answering
• reasoning
• image-text-to-text

datasets:

• wesjos/mario-html-sft

---

🍄 Mario-HTML-v2-4B

> V2: less html tag in Cot than v1.

> This is the GGUF build of wesjos/mario-html-v2-4B.

> The weights here are quantized; the card below, the WebUI in webui/ and the demos are that model's, unchanged.

📦 GGUF files

| File | Size | Notes |

|---|---|---|

| mario-html-v2-4B.Q8_0.gguf | 4.17 GiB | 8-bit, near-lossless — the quant the bundled WebUI is tuned for |

| mario-html-v2-4B.Q4_K_M.gguf | 2.52 GiB | 4-bit mixed, smallest text-only option |

| mario-html-v2-4B.F16-mmproj.gguf | 641 MiB | vision projector — required for image input |

• Text → HTML: one quant is enough, e.g. llama serve -hf wesjos/mario-html-v2-4B-GGUF:Q8_0 (the tag form the Hub generates for this repo).
• Text + image → HTML: add the projector explicitly — --mmproj mario-html-v2-4B.F16-mmproj.gguf. The file name here does not follow the mmproj-*.gguf convention, so don't rely on auto-discovery.
• Bundled WebUI: webui/config.json ships upstream's model_path (./model.q8_0.gguf). In this repo the matching file is ../mario-html-v2-4B.Q8_0.gguf; everything else in the config (endpoint http://127.0.0.1:18086, alias mario-html-v2-4b) applies as-is.

| | |

|---|---|

| Base | Qwen/Qwen3.5-4B · 4.66 B (bf16) · 8.68 GiB |

| Architecture | Qwen3_5ForConditionalGeneration · 32 layers (24 linear + 8 full attention) · hidden 2560 |

| Context | 262,144 native |

| Modalities | text → HTML, text + image → HTML |

---

🖼️ Demo

Every shot is the bundled WebUI (webui/, theme_preset: editorial) with the CoT toggle switched

on — webui/config.json ships enable_thinking: false, which hides the reasoning panel

entirely, so flip it if you want to see the traces. The panel above each answer is the raw <think>

stream; the page below it is the unmodified render.

Screen recording — one session, 67 s

what is 8.2x9.12/2.3? → good for you → 在干嘛?

<video width="100%" controls poster="https://huggingface.co/wesjos/mario-html-v2-4B-GGUF/resolve/main/demo/01-webui-session-poster.png">

<source src="https://huggingface.co/wesjos/mario-html-v2-4B-GGUF/resolve/main/demo/01-webui-session.mp4" type="video/mp4">

</video>

Persona

mario,how are you

<img src="demo/02-persona-how-are-you.png" alt="Persona demo: a greeting page with a mood line, a two-card grid and a closing callout, reasoning panel expanded above it">

Opinion

how do you think of pizza with pineapple?

<img src="demo/03-opinion-pineapple-pizza.png" alt="Opinion demo: a verdict line, a two-column pro/con card grid, a recipe card, three metric tiles and a quote callout, reasoning panel collapsed">

Persona, 中文

喜欢吃pizza吗

<img src="demo/04-persona-zh-pizza.png" alt="Chinese persona demo: three metric cards, a manifesto callout and two flavour cards, reasoning panel expanded above it">

---

📤 Output Contract

One root element; everything else is an optional child. Class list verified against

webui/static/theme.css:

| Component | Markup |

|---|---|

| Root | <div class="ai-view"> |

| Summary | <div class="summary"> · <div class="summary-card"> · <p class="lead"> |

| Card | <div class="card"> |

| Grid | <div class="grid grid-2"> · <div class="grid grid-3"> |

| Metrics | <div class="metric-group"><div class="metric-card"><span class="metric-label">…</span><span class="metric-value">…</span><span class="metric-sub">…</span></div></div> |

| Stepper | <div class="stepper"><div class="step-item">…</div></div> |

| Callout | <div class="callout callout-info\|warning\|success\|danger"><div class="callout-header">…</div></div> |

| Badge | <span class="badge badge-info\|success\|warning\|danger\|accent"> |

| Table | <div class="table-container"><table class="modern-table">…</table></div> |

| Feature list | <div class="feature-list"><div class="feature-item">…</div></div> |

| Code block | <div class="code-box"><div class="code-header"><span class="code-title">…</span></div>…</div> |

<details>

<summary>Raw sample (<code>message.content</code> verbatim, v2 zero-system-prompt greedy)</summary>

<div class="ai-view">
<h3>为什么天空是蓝色的？</h3>
<div class="summary">
<p class="lead">阳光中的蓝光被大气中的分子"散射"到四面八方，而我们的眼睛对蓝光更敏感，所以我们看到天空是蓝色的。</p>
</div>
<div class="card">
<h4>三句话解释</h4>
<div class="step-list"><div class="step-item">…</div></div>
</div>
</div>

The <think> trace that precedes this sample contains zero HTML tags — pure plain-text planning

("a summary lead, then a three-item stepper..."). Two classes in the sample are content-only:

step-list and ai-view-header are not in theme.css, so they render with default block styling —

define your own if you want tighter control. (step-item itself is styled.)

</details>

---

🎨 WebUI

cd webui
pip install -r requirements.txt
python server.py --port 8791

Open http://localhost:8791. Dual-stream rendering (collapsible <think> + live HTML), clipboard

image paste (Ctrl+V), nine theme presets (default · apple · notion · cyber · editorial ·

cards_rounded · glassmorphism · soft_shadows · compact) plus live custom CSS, and a

raw-source / copy-HTML view per message. Defaults in webui/config.json — an OpenAI-compatible

endpoint on http://127.0.0.1:18086 serving the alias mario-html-v2-4b. webui/start.sh is the one-command

path (llama.cpp GGUF backend + WebUI, via systemd-run --user); it expects a sibling

start_backend.sh, which is not part of this repo.

---

⚠️ Notes

• The output is HTML, not Markdown. Feed it a Markdown renderer and you get raw tags.
• The WebUI ships a non-empty default system_prompt — clear it for the zero-system-prompt path.
• v2's webui/config.json also ships enable_thinking: false, i.e. direct-HTML mode. Turn CoT on to

get the traces shown above; the purity claim is about what the traces contain, not about them being

on by default.

• The model picks from the class vocabulary above; arbitrary new CSS classes are not a contract.

Custom theme.css is the supported way to restyle.

• Arithmetic is reliable but not bank-grade — check long decimal chains.
• --reasoning-parser qwen3 needs a recent vLLM.
• webui/run_webui.sh is Linux-oriented (hardcoded /mnt/sdb/... interpreter and TMPDIR paths).

config.json itself is portable (./model.q8_0.gguf); adjust the script for another OS.

---

📄 License

Apache License 2.0.