render-as-html · example gallery

The examples are about the thing that made them.

Fourteen self-contained gallery entries — twelve page shapes, plus a checklist sub-pattern and canonical-primitives reference — and every one is about render-as-html itself or @trq212's "The Unreasonable Effectiveness of HTML." A gallery that documents the system by being built in it.

14 entries · self-contained, zero external requests · WCAG-AA · mobile-tested


14 of 14 examples

dashboard · instrument
Shape coverage

The skill's shapes and sub-patterns as a dense table — register split, dimensions, passes-the-bar — with live filter, sortable headers, a register donut, copy-as-prompt.

document · reading
The Unreasonable Effectiveness of HTML

A briefing on @trq212's thesis and how render-as-html operationalizes it — sticky TOC, open footnotes, a sortable shapes table, and a live "is your doc an instrument?" scorer.

timeline · reading
From idea to one truth — a build log

render-as-html's real idea→ship history on a date spine: live event search, tag-chip filters, week cluster-collapse, per-event copy-as-quote.

runbook · instrument
Author an artifact that passes the bar

The procedure for producing a good render-as-html artifact: sticky progress, steps expanded by default, per-block code copy, a redesign branch, an "I'm stuck" prompt.

comparison · instrument
Where should the artifact live?

The article's core argument as a matrix — HTML vs PDF vs Notion vs Doc vs Markdown — items as columns, live weight tuning, a must-have toggle, copy-as-recommendation.

network-map · instrument
The render-as-html concept graph

Shapes, sub-patterns, principles, and lineage (the article, html-anything) as an SVG graph: click-to-focus, hover-edge-highlight, search-to-focus, cluster toggles.

triage-board · instrument
Roadmap triage

Where the skill goes next — candidate improvements dragged across Now / Next / Later / Cut (with a touch move-picker), live counts, rationale notes, copy-as-prompt.

developer · instrument
PR: the one-truth design system

An annotated-diff + severity-findings writeup of render-as-html's real PR — files-changed nav, local syntax highlighting, click-to-copy findings.

editorial · reading
Why the file you keep should be pokeable

An essay that demonstrates its own thesis: take a position on each claim, watch it compose a round-trip prompt live, then hit "flatten" to see what dies.

execution-log · instrument
Make every state change visible

A live-style execution report — observed-state bar, phase cards, progress ring, searchable log stream, level chips, expandable details, copy snapshot.

deck-review · hybrid
The deck changed shape today

A slide-review workflow with encrypted synthetic payload, status memo, slide preview, local per-slide notes, mailto/copy send-back, and clear notes.

podcast · hybrid
The instrument you keep — fictional episode

An imagined podcast about render-as-html itself, rendered as a briefing — bottom line, takeaways, claims, term inspector, hide-sidebar focus mode, independently scrollable rails. Consumes the podcastextract JSON contract.

checklist · sub-pattern
Pre-ship review

render-as-html's own pre-ship criteria — star + note per item, sticky live count, batch copy-as-prompt with a visible textarea fallback.

primitives · reference
Ten canonical chart and table primitives

The bones the page shapes are built on — donut, ranked bar, sparkline cluster, stacked bar, topology, dense table, comparison matrix, annotated diff, log stream, scatter — each with contract, when-to-pick, and anti-patterns.

No example matches that. to see all fourteen.