Skip to content

Building with AI

playhtml keeps a single guide for coding agents at playhtml.fun/docs/llms.txt. It covers the APIs, which kind of data to use, and the mistakes that silently break sync. Pick whichever way of handing it over fits your tool.

Works with any agent or chat that can open links, including Claude, ChatGPT, Codex, Cursor, and Copilot. Start your request with:

Read https://playhtml.fun/docs/llms.txt first, then help me build a playhtml element that...

If your assistant can’t browse, open llms.txt yourself and paste its contents into the chat instead.

To have your agent pick up the guide on its own every time, install it as a skill. One command works across Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, and other agents that support skills:

npx skills add spencerc99/playhtml --skill building-playhtml-elements

The installer asks which agents to set up. After that, just describe the element you want.

The guide tells agents that you design the experience. They build only what you describe, ask before deciding how an interaction works, and match your page’s existing style with a lighter touch, rather than adding a look of their own. Ideas they have come back as suggestions, not extra code. If you’d rather they fill in the gaps, tell them to use their judgment.

The more of these you describe up front, the fewer questions you’ll get:

  • What people see and do with the element, and what happens in response.
  • Whether everyone shares the same state, or each person has their own.
  • Whether the state should persist across reloads, last only while people are online, or fire once as an event (like a confetti burst).

For example: “A draggable sticky note in vanilla HTML. Anyone can drag it and everyone sees it move. Its position should stay after reload.”

For the hand-written setup, see getting started.