Effective HTML

Effective HTML is a set of Skills from Plannotator, described in its README as "Focused agent skills for creating useful, self-contained HTML artifacts". There are six Skills in the set, covering general HTML, design artifacts, wireframes, clickable prototypes, plan documents and system diagrams. The AI writes the result as a single local web page that you open in a browser to view and click through, with no website to set up. There's also a public guide at effectivehtml.com that's free to read without installing anything, with examples and how to use each Skill.

Who it's for:People who use AI coding assistants to build product prototypes, draw flowcharts or write proposals and want something they can open and look at straight away; readers who don't code can still get ideas from the guide.

Before you start: You need an AI tool that can read Skills; install with npx skills add plannotator/effective-html, or add the Claude or Codex plugin. The license is MIT. By default it only creates web-page files on your computer; only with your explicit consent will it install the tot tool and publish a page to a public link on tot.page. If a generated page uses outside images or fonts, opening it still goes online, and those assets aren't covered by the MIT license. Documentation is in English, and results from tasks given in Chinese haven't been checked.

Based on the project's public documentation. Not tested by AI Inspiration World.