akdarrah
# subscribe

New notes by email, about one a week.

no spam · one-click outor rss · json

adam@akdarrah~/posts$cat claude-artifacts-are-easy-to-make-and-hard-to-share.md

Claude artifacts are easy to make and hard to share

4 min #ai#claude-code#cloudflare

edited oct 23 Added an update at the top. Claude artifacts now do what share-html did, so I retired it.

Update, 2026-10-23: I've stopped using share-html. A few days after I published this, I found that Claude's own artifacts now do everything I built it for: a public link anyone can open with no claude.ai sign-in, republishing to the same URL when the page changes, and comments when you share inside your organization. On a Team or Enterprise plan there's one step left: an Owner has to turn on External sharing under Organization settings > Artifacts. I've removed the skill and the CLAUDE.md rule. The repo stays up, and the post below is how it worked. More on what this taught me in a follow-up post.

Making a page with Claude takes a minute. A report, an explainer, a one-off page for a meeting. It shows up as an artifact, and it looks good.

Then I send the link, and the reply is almost always the same: "I can't open it."

It was never one reason. Sometimes I hadn't set the link permission right. Sometimes the person wasn't on our team account, so the link asked them to sign in to an organization they don't belong to. Each time I'd go back, find the setting, change it and send the link again. The page took a minute. Sharing it took a conversation.

What I wanted was simple:

  • A link anyone can open, with no Claude account and no team membership.
  • A URL nobody can guess, so it's private in practice even though it's public.
  • Not hosted by me. I thought about putting pages on this blog, but I don't want readers of this post to have to trust my server.
  • Free, from a company people already trust.

share-html

So I built share-html, a Claude Code skill. When I say "share this", Claude publishes the page to my own Cloudflare account and hands me a link:

$ share.sh report.html
https://16476356426ab8313e1d12a8.share-97daa5fc.pages.dev

That's a real one, a page about bananas I used for testing. Open it in a private window: no login, no permission screen.

The whole tool is a ~100-line shell script and a skill file. Here is what it does:

  1. Each page gets its own random address. The first part of the hostname is 24 random hex characters, 96 bits. Nobody finds it by guessing.
  2. Each share is a separate deployment. Sharing a new page never touches an old one, and nothing is stored on my laptop except the project name. A new laptop doesn't break old links.
  3. Search engines are told to stay away (X-Robots-Tag: noindex), and links on the page don't pass its address to other sites (Referrer-Policy: no-referrer).
  4. Edits keep the link. share.sh report.html --update <url> republishes to the same address, so I can fix a typo without sending a new link.

The pages go to your Cloudflare account, not mine. Cloudflare's free plan has no bandwidth cap and doesn't ask for a credit card.

Making it the default

The part I like most is that I don't have to think about it. One rule in my ~/.claude/CLAUDE.md tells Claude Code to publish every plain HTML page this way, and to use regular artifacts for everything else: slide decks, docs, dashboards, and pages that need comments or shared data. The rule is in the README.

The pages look exactly like artifacts would. The skill tells Claude to follow the same design guidance it uses for artifacts and never to mention where the page is hosted. The person I send it to just sees the page.

What I learned building it

A few things surprised me.

Cloudflare is moving Pages into Workers. New Pages projects now get routed through Workers by default, which needs a workers.dev subdomain registered first, and that subdomain then shows up in every URL. The script creates its project once with --force to use Pages directly, and every later command just works.

Every deployment has a second, much shorter address. Pages also serves each deployment at an 8-character address. That's only 32 bits, few enough that someone who learns your project name from one link could scan for the others. Each share now includes a five-line _worker.js that returns "not found" for anything except the long address.

Wrangler drops your account details wherever you run it. Cloudflare's CLI writes a .wrangler/ folder into the current directory, including your account ID and account name. Run it inside a project and you can commit that without noticing. The script now runs it from a cache folder.

The first link on a new project is slow. For about 30 seconds Cloudflare is still issuing the certificate, and the link just hangs. After that, links work instantly.

Trade-offs

An unguessable link is not access control. Anyone I forward it to can open it, and so can anyone they forward it to. I don't use this for anything I'd mind leaking.

It's also static pages only. Artifact features like comments, data shared between viewers, or asking Claude from the page don't exist outside claude.ai. For those I still use artifacts and set the permissions carefully.

And the guard that blocks the short addresses runs as a Worker, so each page view counts toward the free plan's 100,000 requests a day. That's plenty for sharing pages with people, not for a page that goes viral.

Try it

You need Node 20+ and a free Cloudflare account:

$ git clone https://github.com/akdarrah/share-html ~/.claude/skills/share-html
$ npx wrangler login

Then ask Claude Code to make a page and say "share this". The link it gives you works for anyone.

share
view .md
# subscribe

Liked this? Get the next note by email.

about one a week · no spam · one-click out · or rss

older hnewer lsections j/kyank code ycomments c
↑↓ move↵ open` shellesc close
akdarrah0:posts1:archive2:about3:shell* / search · ` shell
adam@akdarrah~$help
  ls [posts|tags]   list things      cat <slug>   open a post
  grep <word>       search           tree         the site
  subscribe <email>
adam@akdarrah~$tree -L 2 ~
~
├── posts/
│   ├── my-claude-code-workflow-in-2026.md
│   ├── agree-on-the-api-before-you-build-the-apps.md
│   ├── i-built-a-brain-for-work-and-claude-keeps-it-up-to-date.md
│   └── … 22 more
├── tags/
│   ├── ai  tools  claude-code
│   ├── video  design  process
│   ├── agents  rails  api
│   ├── business  cloudflare  games
│   └── meta  retro
├── about.md
├── archive/
├── feed.xml  feed.json  llms.txt
└── privacy.md  terms.md

4 directories, 45 files