</>MCP Agents Market
Skill

html-anything

by nexu-io8.4kHTMLUpdated 2026-08-23

✨ The agentic HTML editor — your local AI agent writes the HTML, you ship it. 🚀 75 Skills × 9 Surfaces (magazine · deck · poster · XHS / tweet · prototype · data report · Hyperframes) 🛡️ Sandboxed preview · 📤 1-click to WeChat / X / Zhihu / HTML / PNG 🔑 Zero API key — Claude Code / Cursor / Codex /

Claude CodeCursorCodexGemini CLIGitHub Copilot CLIOpenCodeQwen CoderAider

html-anything is an agent skill library comprising 75 composable HTML templates across 9 output surfaces—magazine articles, keynote decks, résumés, posters, social cards, web prototypes, data reports, and Hyperframes videos. It integrates with 9 coding-agent CLIs (Claude Code, Cursor Agent, Codex, Gemini CLI, GitHub Copilot CLI, OpenCode, Qwen Coder, Aider, IBM Bob) detected automatically on your PATH, reusing your existing authenticated session without requiring additional API keys. Local AI agents transform Markdown, CSV, JSON, or plain text into ship-ready, single-file HTML artifacts with sandboxed live preview, streaming SSE rendering, and one-click export to WeChat, X, Zhihu, or PNG/HTML downloads.

Key Features

75 skill templates organized by mode (prototype, deck, frame, social, office, doc) with locked layouts, design systems, and anti-AI-slop constraints
Auto-detects 9 coding-agent CLIs on PATH (Claude Code, Cursor Agent, Codex, Gemini, Copilot, OpenCode, Qwen, Aider, IBM Bob) and reuses existing login sessions—zero API key setup
9 deliverable surfaces: magazine articles, keynote decks (20 variants including Swiss International and Guizang Editorial), résumés, posters, XHS/tweet cards, web prototypes, data reports, Hyperframes video frames
Server-sent events (SSE) streaming render shows live line-by-line HTML generation in a sandboxed iframe; interrupt mid-generation to re-prompt
One-click export: juice-inlined CSS for WeChat/Zhihu paste compatibility, modern-screenshot for 2× PNG to clipboard, standalone .html/.png downloads
Hard-coded design constraints per skill: CJK-first font stacks, 8px baseline grid, contrast ≥4.5, rounded corners, must-use-real-data rule to prevent lorem-ipsum slop
Format auto-detect parses Markdown, CSV, Excel (xlsx), TSV, JSON, SQL, and plain text input client-side with papaparse and xlsx
Hyperframes-compatible video frame scripts (10 motion skills) hand off to Remotion for .mp4 rendering with hidden duration/transition markers

Use Cases

  • 01Generate production-ready magazine-style article layouts or editorial documents from Markdown with warm-parchment or ink-blue design systems
  • 02Create keynote presentation decks in Swiss International, Replit, or Xiaohongshu pastel styles from bullet-point outlines
  • 03Transform CSV/Excel data into visual data reports, finance summaries, or live dashboards without manual formatting
  • 04Produce social-media share cards (X quote cards, Spotify Wrapped-style, Xiaohongshu image-with-text) for one-click clipboard export
  • 05Build web prototypes (SaaS landing pages, dashboards, pricing pages, mobile onboarding flows) from plain-text briefs
  • 06Generate Hyperframes video storyboards (glitch titles, liquid backgrounds, NYT data charts) for Remotion .mp4 rendering

Related Skills

View more

superpowers

An agentic skills framework & software development methodology that works.

Skill294k

skills

Skills for Real Engineers. Straight from my .agents directory.

Skill273.9k

skills

Public repository for Agent Skills

Skill179.3k

ponytail

Makes your AI agent think like the laziest senior dev in the room. The best code is the code you never wrote.

Skill150.6k

html-anything — FAQ

What is html-anything?+

html-anything is a local-first agent skill library with 75 HTML templates for coding-agent CLIs (Claude Code, Cursor, Codex, etc.). Your local AI agent writes production-ready HTML deliverables—magazine articles, keynote decks, résumés, posters, social cards, web prototypes, and video frames—from Markdown, CSV, or plain text input.

How do I install html-anything?+

Clone the repository, run `pnpm install` and `pnpm -F @html-anything/next dev`, then open http://localhost:3000. The app auto-detects any coding-agent CLI you already have logged in (claude, cursor-agent, codex, gemini, copilot, etc.) on your PATH.

Which AI clients and coding agents does html-anything work with?+

It works with Claude Code, Cursor Agent, OpenAI Codex, Gemini CLI, GitHub Copilot CLI, OpenCode, Qwen Coder, Aider, and IBM Bob. The Next.js app spawns these CLIs locally and reuses your existing authenticated session.

Do I need an API key to use html-anything?+

No. html-anything reuses the session you already have from `claude login`, `cursor login`, `gemini auth`, etc. Your existing subscription powers the agent; there is no additional API key or setup required.

Is html-anything free and open source?+

Yes, html-anything is licensed under Apache-2.0. The Next.js app and all 75 skills are open source. You pay only for your existing coding-agent subscription (Claude, Cursor, etc.); the marginal cost of using html-anything is $0.

How do I add a new skill template to html-anything?+

Drop a folder into `next/src/lib/templates/skills/` with a `SKILL.md` file (following the Claude Code skill convention) and an `example.html`. Set frontmatter fields (mode, scenario, surface, design_system), then restart `pnpm -F @html-anything/next dev`. The picker will auto-discover your new skill.

How do I install html-anything?+

Open the source repository on GitHub and follow its README. html-anything is a skill — MCP Agents Market links you directly to the official repo.

Is html-anything free?+

html-anything is an open-source project hosted on GitHub. Check the repository for its license and any usage requirements.

Related searches

Design SkillsDeveloper Tools SkillsProductivity & Workflow SkillsBest MCP ServersBest PluginsBest AgentsTop rated listingsClaude Code toolsBrowse all categories