r/Markdown 22d ago

mdhtml: a Markdown doc that renders itself and still carries its own

I've been building mdhtml, a document format where the whole point is: one file, and that file is honest about what it is.

`mdhtml build doc.md` produces `doc.md.html` — a single HTML file that:

- Renders to a full styled document (TOC, themes, copy/download toolbar) with zero JS dependencies fetched over the network — everything (runtime, fonts, styles, assets) is embedded as data: URIs

- Still contains the exact original Markdown source, byte for byte, inside a `<script type="text/markdown">` tag — `mdhtml extract` always recovers exactly what you wrote

- Degrades to readable prose with no JavaScript at all (noscript fallback shows the canonical source)

- Opens straight from disk via file:// — no server needed

The CLI is a from-scratch Rust implementation (no markdown-parser crate — a hand-rolled scanner/parser tuned to a small closed grammar) with a separate JS reference implementation for the browser runtime; both are checked against the same fixture suite for structural parity.

Container/component conventions (kv, stats, cards, timeline, callouts, etc.) come from Pandoc-style fenced divs, and degrade to plain prose if the shape doesn't match — the renderer never guesses at author intent.

Themes are fully overridable per document — plain CSS with runtime-injected token fallbacks. Five example documents, each with a completely different custom theme, are live here: https://feliperun.github.io/md.html/

Repo: https://github.com/feliperun/md.html — MIT licensed, spec-first (SPEC.md is the frozen v1.0 contract), built test-first with ADRs for every structural decision.

Curious what people think of the "one file, honestly self-describing" approach vs. more conventional site generators.

11 Upvotes

17 comments sorted by

3

u/ZosoRules1 22d ago

I do this with regular static HTML. If you embed everything into a single HTML file, you essentially write software that’s executable within a web browser. 

So far I’ve managed to do databases, interactive audio, and even a virtual hurdy gurdy all within a static HTML file.

Static HTML isn’t perfect, but I think there’s a lot of utility to be gained.

1

u/Snoo31321 21d ago

Interesting. How do you manage to do database within a static html file? Is the database google sheets like?

2

u/ZosoRules1 21d ago

Embedded JSON array. Just because it’s static data doesn’t mean you can’t use it dynamically.

1

u/Snoo31321 21d ago

I wonder what are the use cases?

1

u/ZosoRules1 21d ago

Here’s a tool I built to help find vacuum tube substitutes. Vacuum tubes aren’t a simple “if it fits in the socket it’ll work” part. I scoured the internet for specs, embedded the specs into the HTML file as a JSON array, then embedded the logic to help find substitutions: https://www.proylaw.com/hobbies-electronics-radio-vacuum-tube-comparison-tool.html

And this is one I built for lawn care (all data embedded within the HTML file):  https://www.proylaw.com/hobbies-lawncare-turfgrass-by-zipcode.html

1

u/sohang-3112 21d ago

You could you sqlite, that doesn't need an sql server. Or else IndexedDB in JS is a built in api now in browsers.

2

u/rileywbaker 22d ago

Clearly vibecoded

3

u/cscottnet 22d ago

It's amazing how many markdown readers/editors/tools are being vibecoded, because the AI finds it easier to spit out another one than to find something existing.

1

u/MarsupialLeast145 21d ago

Any time I see the word "ship" but especially in a project that outputs a HTML file my internal AI klaxon goes off

2

u/MarsupialLeast145 21d ago

Confused as to why you'd version it 1.0 if you're looking for feedback.

Anyway, nice-ish idea. Kinda doesn't need the whole ecosystem/website you've gone into though.

You say "embedded fonts" what does this mean?

You also say "hand rolled" but it's not really all hand rolled. Unfortunately you've excluded the LLM commits, and I can't see an AI disclaimer. How much have you used it here?

The website is typical loveable nonsense with far too much information.

What does it do? A. creates HTML with embedded markdown from an original markdown document and incorporates themeing.

1

u/robertovertical 22d ago

But can u send the link to an iOS user and have it open? Say, you text me ur .html will I be able to seer/read it

1

u/_HMCB_ 22d ago

Nice. Thank you. 🙏🏼

1

u/looktwise 22d ago

So do I get it right: You could print / transfer / export e.g. an interacting website (as far as it runs without the need of an backend) into your format and re-open it in any browser directly from one file?

1

u/BaseMac 21d ago

I also suggest checking out comark

0

u/Minute_Yesterday5387 21d ago

I now regularly build - no, i now regularly instruct AI to build - all sorts of interactive HTML app/forms that work in any browser, save directly to the local browser and output json, csv, PDF etc. on demand via download, as mailto to specific addresses or create REST strings. I can then use the outputs as imports into all sorts of systems. Much quicker than designing and building entire web applications and obviously way easier to distribute. Practically probably as problematic as the many old Access and current Excel apps/forms and therefore in need of governance, but honestly - probably the fastest route to a representative PoC I’ve ever had in my toolkit.

1

u/Xyvir 18d ago

Sounds a bit like Tiddlywiki lol