Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add skills/s3yed/appie-kit/agentic-webdesign-html-anythingnpx skills add S3YED/appie-kit --skill agentic-webdesign-html-anythinggit clone --depth 1 https://github.com/S3YED/appie-kitWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/s3yed/appie-kit/agentic-webdesign-html-anything)<a href="https://agentmods.dev/skills/s3yed/appie-kit/agentic-webdesign-html-anything"><img src="https://agentmods.dev/badge/skills/s3yed/appie-kit/agentic-webdesign-html-anything.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00078 | $0.01495 |
| Opus 5 | $0.00039 | $0.00747 |
| Sonnet 5 | $0.00016 | $0.00299 |
| Haiku 4.5 | $0.00008 | $0.00150 |
Grade A, and why
agentic-webdesign-html-anything scanned grade A with 1 finding against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 5d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Runs shell commandslowCapability
Expected in a hook, worth knowing in a rule or an instructions file.
Agent transport | `child_process.spawn` · one adapter per CLI How it starts
The opening of the file, as written. The whole thing — 106 lines — stays where its author put it; the contents beside it link to each section on GitHub.
html-anything — Agentic HTML Editor
What it is
html-anything is an agentic HTML editor from the nexu-io team (the same team behind Open Design, 40k+ stars). It turns any AI coding agent CLI into an HTML publishing engine.
The pitch: Markdown is the draft. HTML is what humans read. Your local agent writes it. One-click ship to WeChat/X/Zhihu/PNG.
Quick facts
- Repo: https://github.com/nexu-io/html-anything
- Stars: 7,700+ (as of July 2026)
- License: Apache-2.0
- Install:
npm install -g @nexu-io/html-anything - Runs on: Local (
pnpm dev) or Vercel (agent stays on your laptop)
Supported coding agents
Auto-detected on PATH (including ~/.local/bin, ~/.bun/bin, /opt/homebrew/bin, ~/.npm-global/bin):
| Agent | Detection | Invocation |
|---|---|---|
| Claude Code | claude |
claude -p --output-format stream-json |
| OpenAI Codex | codex |
codex exec --json --sandbox workspace-write |
| Cursor Agent | cursor-agent |
cursor-agent --print --output-format stream-json --force --trust |
| Gemini CLI | gemini |
gemini --output-format stream-json --yolo |
| GitHub Copilot | copilot |
copilot --allow-all-tools --output-format json |
| OpenCode | opencode-cli / opencode |
opencode run --format json --dangerously-skip-permissions - |
| Qwen Coder | qwen |
qwen --yolo - |
| Aider | aider |
aider --no-pretty --no-stream --yes-always --message-file - |
No API key needed. Reuses your existing CLI auth (claude login, cursor login, etc.).
75 skills × 9 surfaces
Skills live under src/lib/templates/skills/ and follow the Claude Code SKILL.md convention with extended frontmatter (mode, scenario, surface, preview, design_system).
Surfaces
| Surface | Mode | Skills |
|---|---|---|
| 📖 Magazine article | prototype |
7-12 |
| 🎬 Keynote deck | deck |
20 (Swiss International, Guizang Editorial, XHS Pastel, Hermes Cyber, Replit, Magazine Web...) |
| 📄 Résumé | prototype |
Multiple |
| 🖼️ Poster | prototype |
Multiple |
| 📱 Xiaohongshu card | social |
Multiple |
| 🐦 Tweet card | social |
Multiple |
| 🛠️ Web prototype | prototype |
web, SaaS landing, dashboard, data report |
| 📊 Data report | prototype |
Multiple |
| 🎞️ Hyperframes video | frame |
10 (liquid hero, NYT data chart, sticky-note flowchart, glitch title, cinema light-leak, macOS notification, logo outro...) |
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 5d ago First seen · 106 lines · 78 tokens per session scan A 44de0988c062
agentic-webdesign-html-anything is a skill published in the GitHub repository S3YED/appie-kit (7 stars, last pushed 10d ago), licensed MIT. It adds 78 tokens to every session and 1,495 once invoked, about $0.0004 per session on Opus 5. A static security scan graded it A with 1 finding (runs shell commands). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
migration-architect
Zero-downtime migration planning, compatibility validation, and rollback strategy generation. Tools for system, database, and infrastructure migrations with minimal business impact. Use when planning a database migration, infrastructure cutover, system replacement, or any high-risk transition that needs explicit…
spec-driven-workflow
Use when the user asks to write specs before code, define acceptance criteria, plan features before implementation, generate tests from specifications, or follow spec-first development practices.
incident-commander
Comprehensive incident response framework from detection through resolution and post-incident review. Battle-tested SRE/DevOps practices: severity classification, timeline reconstruction, structured post-incident analysis. Use when declaring an incident, coordinating multi-team response during an outage, leading a…
observability-designer
Design production-ready observability strategies combining metrics, logs, and traces. Includes SLI/SLO design, golden-signals monitoring, alert optimization. Use when adding observability to a new service, refactoring alerting that is too noisy, or designing an SLO program before scaling production load.
cnblogs-skill
博客园(cnblogs.com)自动化发文与管理技能。覆盖选题调研、文章撰写（含风格排版）、配图生成上传、API发文全流程、格式检查、社区互动（推荐/评论/回复/消息）、博问互动等全部操作。当用户提到博客园、cnblogs、发博文、写文章发布、博客管理、博客互动、推荐博文、回复评论、查看博客消息、博问提问回复等场景时必须使用此技能。即使用户没有明确说"博客园"，只要意图是管理一个技术博客账号（发文、互动、活跃），也应触发。.
zhihu-content-manager
知乎内容发布与管理自动化工具。支持文章发布、编辑、删除、草稿清理、话题标签管理、封面图上传、乱码检测与修复。当用户提到知乎发文、知乎发布、知乎文章、知乎回答、知乎草稿、知乎专栏、知乎乱码、修复知乎内容或任何涉及知乎内容管理的操作时触发。.