Modern Creator Network
Jay E | RoboNuggets · YouTube · 12:06

Is HTML the New Markdown? (Claude Code)

Jay E reacts to Anthropic engineer Tariq's viral 9.3M-view post and lifts the four levels by which HTML beats Markdown as an agent output format.

Posted
yesterday
Duration
Format
Tutorial
educational
Channel
JE|
Jay E | RoboNuggets
§ 01 · The Hook

The bait, then the rug-pull.

A senior engineer on the Claude Code team just dropped an article arguing that Markdown, the default file format every agent reads and writes, is quietly throttling your output. It pulled 9.3 million views in 48 hours. Jay E lifts the four-level framework and runs it end-to-end so you can decide whether to rip Markdown out of your own stack.

§ · Stated Promise

What the video promised.

stated at 00:18I'll show you what made this article land with millions of people and the four levels by which you can use HTML to work better with your agents.delivered at 09:50
§ · Chapters

Where the time goes.

00:0000:30

01 · Cold open + promise

Pattern-interrupt question, the 9.3M-views credibility receipt, the four-levels promise.

00:3001:40

02 · Tariq's core thesis

Markdown became the dominant agent format but is now restrictive (hard to read past 100 lines, no rich visuals).

01:4003:13

03 · Markdown vs HTML, same data two outputs

Side-by-side renderings: Q1 sales report, API outage incident, customer reports. HTML wins on scannability for non-technical reviewers.

03:1305:00

04 · Level 1, HTML for understanding things

Asks Claude Code to teach him cli-printing-press from GitHub, then converts the verbose reply into a throwaway HTML explainer page.

05:0006:59

05 · Community plug + Level 2, HTML for explaining

RoboNuggets soft CTA. Then: his Agentic AI Foundations course slides are all HTML-generated by Claude Code. Microsoft engineers internally sharing AI-generated HTML for SWE/PM coordination.

06:5908:33

06 · Level 3, HTML for prototyping

Asks Claude Code for 10 styles of the same Markdown-vs-HTML slide; gets 10 visual variants in one shot. Builds Tariq's checkout-button playground with live sliders.

08:3309:50

07 · Level 4, HTML for tweaking things

Demos his own tweak skill: embeds an HTML control panel (title size, body size, kerning, glow, saturation) next to a live website, click bake to get a patch you paste back into Claude Code.

09:5011:40

08 · But what about the cost?

Preempts the token-cost objection. Reframes as ROI per token, not absolute cost. Quotes Tariq's FAQ. Concedes HTML's drawbacks (2-4x longer to render, version control friction).

11:4012:06

09 · Summary + subscribe CTA

Markdown isn't dying, but for communicating an idea, render via HTML. Plug for separate HTML-slides lesson.

§ · Storyboard

Visual structure at a glance.

selfie cold open
hookselfie cold open00:00
title card (pixel art)
hooktitle card (pixel art)00:13
HTML for Agents four-levels card
promiseHTML for Agents four-levels card00:26
Tariq's article on X (receipt)
promiseTariq's article on X (receipt)00:30
Markdown vs HTML side-by-side
valueMarkdown vs HTML side-by-side01:37
rendered Q1 sales report HTML
valuerendered Q1 sales report HTML02:17
API outage incident postmortem
valueAPI outage incident postmortem02:27
Q2 planning recap (notes to action)
valueQ2 planning recap (notes to action)02:57
cli-printing-press GitHub repo
valuecli-printing-press GitHub repo03:36
How Printing Press works HTML explainer
valueHow Printing Press works HTML explainer04:16
Claude Code building slide 2
valueClaude Code building slide 204:46
RoboNuggets community plug
ctaRoboNuggets community plug05:17
Level 2 transition
valueLevel 2 transition05:27
Six modules. One mental model. course slide
valueSix modules. One mental model. course slide05:57
Nicholas's interactive HTML on X
valueNicholas's interactive HTML on X06:13
10 styles, pick one prototype grid
value10 styles, pick one prototype grid07:00
more style variants
valuemore style variants07:30
checkout button tuner playground
valuecheckout button tuner playground07:50
Claude Code plan mode comparison
valueClaude Code plan mode comparison08:28
Global Autonomous Risk Infrastructure demo
valueGlobal Autonomous Risk Infrastructure demo08:52
tweak skill sliders panel
valuetweak skill sliders panel09:32
But what about the cost? card
valueBut what about the cost? card10:02
ROI per token (cheapest path to understanding)
valueROI per token (cheapest path to understanding)10:22
ROI per token (neural-networks visual)
valueROI per token (neural-networks visual)10:42
§ · Frameworks

Named ideas worth stealing.

00:22list

The Four Levels of HTML for Agents

  1. Understand things (turn verbose agent replies into readable HTML explainers)
  2. Explain things to others (HTML slides instead of Gamma/PowerPoint, share with non-technical peers)
  3. Prototype things (ask for N style variants, get visual prototypes instead of wall-of-text plans)
  4. Tweak things (embed HTML control panels next to live pages, bake-to-patch workflow)

Tariq's four use cases for using HTML as the output medium between you and your agent.

Steal forDirect lift for any Joe video explaining Claude Code workflows. Pair each level with a JoeFlow / ModBoard / Mod Producer demo.
10:00concept

ROI per token

Reframe of token cost: don't measure absolute tokens, measure whether the time + tokens you spent actually returned value.

Steal forCounter-argument to every 'AI is too expensive' objection. Joe can use this exact frame for any pricing or context-window discussion.
02:10concept

Same data, two outputs

Visual proof-pattern: show identical underlying data rendered as raw Markdown vs styled HTML, side-by-side. Used for sales reports, incident postmortems, voice-of-customer notes.

Steal forSales-page visual for any before/after Joe pitches: JoeFlow transcripts (raw vs rewriter), Mod Boss compiles (chat scrollback vs structured).
§ · Quotables

Lines you could clip.

00:00
What if the way you're communicating with your agents is restricting how good their output can be?
Cold-open question, no setup needed, pattern-interrupt about a problem the viewer didn't know they had.TikTok hook
01:10
Markdown files are actually sometimes quite restrictive, especially if you use markdown files for planning or as output.
Heretical thesis. Anyone in the AI-tools space has been told Markdown is the universal format.IG reel cold open
10:15
It is sometimes better to just think of the lens as a return on investment. With the time and tokens that you are spending with your agent, are you actually getting the return and the value from that interaction?
Standalone reframe that travels well into pricing/value debates outside this video's narrow topic.newsletter pull-quote
11:00
While Markdown often uses fewer tokens, the added expressiveness of HTML and the much higher likelihood of me reading it means you would get better overall output.
Direct Tariq quote. High authority, lands the whole argument in one sentence.TikTok hook
§ · Pacing

How they spent the runtime.

Hook length30s
Info densityhigh
Filler8%
Sponsors
  • 04:5705:27 · RoboNuggets community (own)
§ · Resources Mentioned

Things they pointed at.

00:12linkTariq's 'Using Claude Code: The Unreasonable Effectiveness of HTML' article
04:08toolcli-printing-press (GitHub repo)
05:30toolGamma / PowerPoint (as foil)
06:00productAgentic AI Foundations course (own)
06:36linkNicholas Bustamante's interactive HTML version of Tariq's article
06:54linkBin Liu (VP Product, Agent) note
08:00toolhtml-it skill (own, gated behind RoboNuggets-free, code n54)
08:33tooltweak skill (own)
§ · CTA Breakdown

How they asked for the click.

11:40subscribe
Consider subscribing because that helps me a lot to put out more educational stuff like this. And if you want to know how I created those HTML slides, I actually made a separate lesson for it, which you can just find somewhere in this video.

Soft tail CTA: subscribe + watch-next pointer. The harder CTA fires mid-video at 04:57 with the community pitch + skill download. Two-stage funnel: free skill via community signup is the lead magnet, paid Agentic AI Masterclass is the upsell.

§ · The Script

Word for word.

HOOKopening / re-engagementCTAthe pitchmetaphoranalogystory
00:00HOOKWhat if the way you're communicating with your agents is restricting how good their output can be? Well, a senior engineer on the Cloud Code team just published this article making exactly that case, and it already pulled 9,300,000 views in just two days. His argument is that HTML is more powerful than Markdown if you know how to use it. So I thought I'll show you what made this article land with millions of people and the four levels by which you can use HTML to work better with your agents. Let's dive into it.
00:30So this person, Tariq, he's part of the technical team of Cloud Code of Entropic, and he recently published this article, like, two days ago that's titled, using Cloud Code, the unreasonable effectiveness of HTML. And you can see it went quite viral. Let's see. It already has 9,300,000 views forty eight hours after it was written. And I read the whole thing, and it is actually quite useful. And I tend to agree with his points in here, so I thought it might be useful for you as well. But just to go through the sort of key points that he mentioned here as his core thesis,
01:01he's saying that markdown, even though it has become the dominant file format used by agents, which are present when you're making like your call .md's or your agents.md's or your design.md's. Since agents have become more and more powerful, he argues that markdown files are actually sometimes quite restrictive, especially if you use markdown files for planning or as output. It is actually quite difficult to read or at least takes time to read if it's more than a 100 lines, and I tend to agree. That's why from my experience and it seems from Tariq's as well, there is now this sort of growing cluster of people who have started preferring HTML as an output format
01:37instead of markdown. And if in case you don't know the difference between those two, both of these in their essence is all just text. But the key difference between them is how they render to you as the user. And by render, we just mean how they appear on your screen. For example, if you look at your markdown files, all they are are text files with basically these hashtags or number signs connoting the heading or the bigger text in your whole document, and then you have the body written down in here. So very clean, still very readable by people. But if you just compare it with HTML,
02:07stands for hypertext markup language, you can see how much more visual it is. It can render colors for you. It can render tables and so on. And in fact, just to go through some more examples in here so you can differentiate between the two before we go into the actual use cases. Let's say you're reviewing a report for an API outage incident. If you render it in markdown, it is still formatted like this where you need to read from top to bottom. But if you are rendering it via HTML, you can see it's much more visual. You can point the viewer to key parts in here, like, for example, this colored box with the root cause if you think that is more important to be communicated in order to drive your point better. If you have some sort of customer report, it is so much easier to visualize everything using HTML versus, a markdown document, which just list those data points for you. This is especially true when it comes to planning, which is something that we'll show more later. But let's say you are planning for your next sprint or your next project, if you just have those rendered in markdown, it takes much longer to review them just because of the nature of how they're being rendered versus if you render them visually through HTML just like this one. So given that, when should you now use HTML instead of markdown?
03:13So I'll be giving a few examples, but if you want to try this out yourself and also instantly give your agent a bit of HTML mastery with the stuff that I'll show here, you can find this skill I made which basically just summarizes all the knowledge and all the examples that I will be showcasing in this video. And you can just give this whole thing to your agent, and you can have it custom fitted for your own setup. So the first thing where HTML really excels in is for helping you understand things. For instance, the other day, I was trying out this new printing press toolkit over at GitHub in this repository, and I actually wanted to understand how it works under the hood. So naturally, what I did is open up Cloud Code, give it the GitHub URL of this repo, and I just ask it to teach me how printing press works, which is this toolkit,
03:54CTAand what are the general steps that it takes. Now it actually gave me a pretty good reply in here, but one of the problems with these agents is that they are actually sometimes quite verbose. And if you're reading through just a wall of text to understand something, it is not always the best experience. And so from here, what I just did is to ask it to build a throwaway HTML page for me that basically captures all of that sort of explanations that it has, but put it in a nicer format that I can read to. And if you watched that video that I published a day ago, this is basically coming from that workflow where I ask Cloud Code to render this in HTML. And it's, number one, much nicer and easier to understand. And number two, it's also much easier to present to other people. And then to take it further, because I wanted to explain specifically this step four, I just copied that part that it said, and I asked it to explain it simply. And again, it gave me this wall of text. So what I just did is to ask it to make a separate HTML slide explaining that line and to add it as slide two for this HTML page. And so it was able to build that, and it was also able to, in parallel, give me this nice visual,
04:57CTAwhich again is much easier to communicate with. And by the way, if you're interested in going from just using AI to getting paid for it, then check out the Robo Nuggets community down in the description. We've got founders in there who landed their first client in weeks, live build sessions where we create this stuff together, and the actual templates behind what I just showed in this video. The community is also the reason these lessons get made, so see that below if that's for you. Now the next thing that I think HTML is quite outstanding on is when you need to explain things to other people, which is pretty much what I'm doing here. Right? So all of these slides, they are all formatted in HTML.
05:28And you can see just how much more shareable and explainable they are versus if we are viewing like a text file together, especially for nontechnical people, product managers, and people who are more, let's say, output and visual based. This type of visual rendering and icons is just a much more better experience when you need to explain and communicate things to your peers. One great example of this is the emergence of using HTML slides in place of tools like Gamma or PowerPoint. For example, this one that you are seeing, which is our Agenetic AI foundations course that we do in person as well as in the community, All of these are generated by Cloud Code, all using HTML.
06:02So you can see it's more engaging. It has nice visuals. It has nice animations, and you can even create diagrams or visuals like this, which is much more visual versus having to explain everything through text. And the thing with HTML is you actually don't need to have those fancy animations in order to get some benefit from it. So you can see here, I saw this post from Nicholas, which was actually a good application because he basically turned the article from Tarik into this interactive HTML page. And he says here that from within Microsoft, their engineers sent AI generated HTML
06:31to coordinate between software engineers and product managers. And I can definitely see this happening because HTML, files like this, are still information rich. But apart from that, they are also much easier to read. Here's another note by Bin Liu, who is the VP for product for agent, and they pretty much do the same thing. So it's definitely worth exploring if HTML would be sort of a good communication medium for you and your clients or your peers in order to align better on plans and documentation.
06:57The third use case for HTML is you can actually use it to prototype things, and this is very important, especially when it comes to visual design. To give an example, what I basically ask Claude Code to do is to give me 10 styles of the different HTML slides for this markdown versus HTML pack that we were building, and it gave me several prototypes that I can choose from. Right? And you can see if you were to do this sort of in markdown mode or as a plan in plan mode, then just having to read that wall of text where it describes, let's say, this prototype number seven as having a Japanese Zen theme and then this prototype number eight to have a corporate cool theme. It doesn't have that same impact or effect versus if you just quickly see all of these visual designs in one go and have them prototype those for you. To give it another good example from the article by Tariq, he gave this example prompt where he asked Cloud Code to prototype a new checkout button and to create an HTML file showing that checkout button. So I tried that prompt myself, and it gave me this playground where I can tweak the press duration. I can change the starting color of this checkout button if I wanted to, change the shape to be more circular. And then once I'm done with that, I can just copy the parameters in here and then paste it back to Cloud Code. If So you're prototyping, you can see with a simple prompt like that, you can easily create a throwaway HTML page that just gives you a lot more control when it comes to these visual assets. And just to give you a quick comparison, I sent that same prompt over at Cloud Code on planning mode, and it gave us this markdown formatted plan, which is okay. But you can see how different it is versus seeing it visually. Right? Plan mode is probably good for some use cases, but for several instances, especially for visual matters and assets, I think using HTML
08:30is just a much better experience. And, naturally, the other thing that you can use HTML for is to tweak things. To give an example, let's say you want to tweak the design of this website. What you can do is to actually embed an HTML window like this, which just lets you tweak the elements in this website, like, for example, the title size, the size of the body text. You can even have more options in here, which gives you nice sliders for, let's say, the saturation of the website if you want it a bit more colored. Also, it gives you space to adjust the kerning of the fonts. The glow of that title text is also possible. And then you can just ask Cloud Code to give you more sliders depending on what it is that you want to tweak in this website. And that is all HTML based, and that is just a skill that I made called tweak, which, again, you can just grab it below. And simply what I did here is to just invoke that skill and give it the link to that HTML file, which is basically this website that you are seeing. And then once you're done with that, similar to the other thing that we did earlier, you can just click on bake, and that gives you a nice prop in here. And if you copy that patch and give it the clogged code, then all of those changes that you wanted made will be applied to this final website. But there you can see because of the power of these agents with rendering these HTMLs,
09:37you can actually do stuff like this that wasn't really possible before in order to better your workflow, especially if you're in the business of communicating ideas, visually showing them, or even if you just want to understand things faster and better. So as you can see, HTML is quite good for a lot of use cases, but there's obviously a big question behind all of this. Right? Which is what about the cost? Because as you would rightfully ask, HTML would need more tokens. Right? And this is a completely valid question, especially since we are living in a compute constrained environment now. And it's also why I don't think HTML will replace markdowns for everything. Markdown files definitely still have their place. But one concept that I think you should consider is the ROI that you are getting from every token that you spend. Let's say for instance that you are using HTML to explain or understand things better. If you have a lot of conversations or turns with your agent in order to understand a complex topic, for example, then that might actually end up costing you more tokens versus if you just have it visualize that same concept for you. So instead of just talking about token usage as an absolute, it is sometimes better to just think of the lens as a return on investment. Like, with the time and the tokens that you are spending with your agent, are you actually getting the return and the value from that interaction? In fact, Tariq also mentioned this in the FAQs, which I think is one of the key sections that one should read if you are reviewing this article. Basically, he says here that while markdown often uses fewer tokens, the added expressiveness of HTML and the much higher likelihood of me reading it means that you would get better overall output. And he also highlighted here some of the other drawbacks of HTML, which are important to consider and why markdown, I think, is still here to stay because HTML does take longer. So around two to four times longer to render versus markdown. And also there is another aspect around version control. So if those aspects, if those things are important to you, then using HTML for your particular use case might not be the right thing. But there, I hope you got something from that video. In summary, I think markdown files are still here to stay. Cloud. Mds are probably not gonna be renamed to cloud.htmls
11:34CTAanytime soon. But if you need to communicate an idea or have your agent communicate an idea to yourself, then having it render things via HTML may be a good idea for you. So there, I hope that was useful. And if it is, then consider subscribing because that helps me a lot to put out more educational stuff like this. And if you want to know how I created those HTML slides, I actually made a separate lesson for it, which you can just find somewhere in this video. See you guys next time. Thank you.
§ · For Joe

Steal the react-to-viral-article + four-level framework.

Claude Code playbook

Jay didn't write a viral article, he packaged one. The format is repeatable: find a high-authority technical post, lift its core list, demo each item on screen, gate a downloadable skill behind your community.

  • Find a viral technical post from a credible source (Anthropic engineer, OpenAI researcher, GitHub eng) within 48-72 hours of publication.
  • Lift the structural list (here: four levels) and use it as your chapter spine. Don't invent, translate.
  • For each item, show a 20-30 second screen-record demo in Claude Code. Visual proof, not narration.
  • Build a single skill file that summarizes the whole framework. That's your lead magnet, gated behind community signup.
  • Preempt the obvious objection (here: token cost) with a reframe (ROI per token). Quote the original author's FAQ for authority.
  • Make your B-roll itself an example of the thing you're teaching. Jay's slides are HTML-rendered by Claude Code, meta-loop intentional.
  • Hard CTA mid-video (community + skill), soft CTA at end (subscribe + watch-next).
§ · For You

Stop pasting walls of text at your agent.

If you use Claude Code or any coding agent

Markdown is fine for storage. For anything you actually have to read (plans, reports, explanations) ask your agent to render it as a throwaway HTML page instead.

  • Next time Claude / Cursor / Cline gives you a verbose explanation, end your prompt with 'now render that as a throwaway HTML page I can open in my browser.'
  • Use HTML for sales reports, incident postmortems, meeting recaps, sprint plans, anywhere data is hard to scan in raw form.
  • Prototype visual designs (buttons, layouts, color schemes) by asking for N variants in a single HTML file. Way faster than describing them in Markdown.
  • Worried about token cost? Compare against the cost of multiple back-and-forth turns trying to understand a long Markdown reply. Usually fewer total tokens.
  • Keep Markdown for CLAUDE.md, AGENTS.md, design.md (system files agents read into context). Switch to HTML when you are the reader.
§ · Frame Gallery

Visual moments.