What was old is new again

A few years ago, making something like the graphic below would have been a project. You’d need a designer to mock it up, a front-end developer to build the SVG animation, and a few rounds of “can you make the line glow a little less?” before it shipped.

I made it in a few minutes by typing into a chat box.

That’s an HTML artifact — a single, self-contained chunk of HTML, CSS, and JavaScript that Claude.ai generates and renders live, right there in the conversation. You describe what you want, you see it run, and you keep talking until it’s right.

Those three — HTML, CSS, JavaScript — used to be fun. In the early days of the world wide web, building for the web meant opening a file, typing a few tags, and hitting refresh to watch something appear. No complicated dev setup. Remember WYSIWYG (What you see is what you get)?

Then the web got commercial and ambitious, the tooling stacked higher and higher, and somewhere in there making anything polished quietly turned into a specialist’s job. The happy twist of this whole moment is that AI is handing it back. The oldest, simplest tech on the web is fun again — and, for the first time, usable at its full potential.

What I actually did

The whole thing started as one sentence: “Make me an interactive chart about the Leonardo DiCaprio age cut-off meme — the one where his girlfriends never get older than 25. And give it to me as an artifact in html format. Feel free to use css and javascript. Everything should be in a single file.”

Claude came back with a first draft that worked. I then continued working with Claude.ai making changes to the artifact:

• “Make the background darker and add a film-grain texture.”
• “Each woman’s line should start at her birth year and rise one year per year of age.”
• “Add a red dashed line at age 25 and make it glow.”
• “Put a scrubber at the bottom so people can drag through the years themselves.”
• “The two women who broke the rule should be a different color — make them green.”

The artifact you’re looking at is maybe the tenth revision, and not one of those revisions required me to open an editor. Yet.

The revision that didn’t just work

The most useful moment was the one that didn’t land on the first ask.

For a while the graphic was actually two charts: one plotting age over the years, and a second timeline showing each girlfriend’s birth year as Leo aged. The second one was a mess — ten labels stacked on top of each other, impossible to follow. My first instinct was to keep nudging: smaller text, move that label, dim this line. None of it helped, because the problem wasn’t a color or a font size. It was the structure.

So I stopped tweaking and said, roughly: “These two charts are really the same chart — combine them. Make every person one diagonal line that starts at their birth year and rises a year of age per year, and reveal them one at a time as it plays.”

It came back as the version above: one timeline, each life a line, the whole thing readable at a glance.

Why this matters more than it looks

The novelty isn’t that an AI can write code. We’ve had that for a while. The shift is the feedback loop:

1. You say what you want in plain language.
2. You immediately see the result, fully rendered and interactive.
3. You point at the thing on screen and say “change that.”
4. Repeat until it’s exactly right.

That loop collapses the distance between an idea and a finished thing. You don’t need to know SVG coordinate systems or requestAnimationFrame to get a smooth animated chart. You just need taste and the willingness to keep nudging.

You stay in control

The part I want to stress to anyone who hasn’t tried it: you can make your own manual changes.

• Think the copy is too snarky? Rewrite it yourself — it’s just text in the file.
• Want to take the whole thing somewhere else? Copy the HTML and host it anywhere. It’s yours, fully standalone, with no dependency on Claude to keep running.

That last point is the quiet superpower. The artifact isn’t locked in a walled garden. It’s plain HTML. The graphic above, in fact, started life as a single .html file that I dropped straight into this blog — and then asked Claude to adapt into a component so it would sit nicely inside the page. Same content, new home, a few minutes of work. (Here’s the original .html file — one self-contained page. Save it, open it in any browser, and it just runs.)

One small gotcha, precisely because it’s just a file: I AirDropped the finished HTML to my phone, tapped it, and there was no interactivity. It turns out iOS previews HTML without running its JavaScript. The Files preview shows the layout but never starts the animation. Opening the same file in an actual browser (or putting it on the web) fixed it instantly. A good reminder that an artifact is just a web page: portable, yes, but it still needs a real browser to come alive.

The real trick is the “ancient” tech

Here’s the part I find most interesting, and it’s a little counterintuitive: the magic isn’t some new technology. It’s old technology, finally usable.

HTML, CSS, and JavaScript could always do this. A single file can hold a styled, animated, interactive graphic — no server, no build step, no dependencies. The browser is quietly an incredible canvas: SVG, CSS animations, custom properties, requestAnimationFrame, all native, all sitting right there, free.

So why did the web get so complicated? Because we wanted more — more interactivity, more polish, more reuse — and hand-writing enough precise code to get there was brutal. So we built layers to manage the brutality: frameworks, bundlers, transpilers, component systems, dependency trees thousands deep. None of that was the browser’s limitation. It was a workaround for a human one — the sheer labor of authoring all that fiddly markup and logic by hand. And because this requires a lot of knowledge, we started using SaaS platforms like Miro, Google Slides, and Canva.

AI removes that bottleneck. The chart above is one .html file. No framework, no build, nothing to install — just browser features that have been standard for years.

The heavy stacks still earn their keep for genuinely big apps — teams, complex state, things you maintain for years. But for an enormous range of things — a graphic, a tool, a calculator, a one-off interactive idea — that machinery was always overkill, and now you genuinely don’t need it. We get to use the simplest, most durable, most portable tech on the web at its full original potential. It was just waiting for us to be able to write it fast enough.

Big Bonus: It is now very easy to share this single HTML file with anyone. They don’t need to install any software to view the cool stuff you just shared with them. A browser is sufficient.

Try it yourself

If you’ve never done this, here’s the lowest-effort way to feel the magic:

1. Open Claude.ai.
2. Ask for something visual — “build me an interactive timeline of X,” or “make a calculator for Y,” or “turn this data into a chart I can play with.”
3. When it renders, don’t accept the first version. Push back. Ask for changes. Watch how fast it iterates.
4. Once you have the HTML file, share it with someone. It’s self-contained and works in any modern browser.

The point of this post is just to show one finished result and say: this is genuinely easy now, and you have far more control than you’d expect. The hard part was never the code. It was getting from “I have an idea” to “I can see it.” That gap is mostly gone.

Go make something.