html-anything is a local AI-assisted HTML editor in which coding-agent command-line tools create documents such as articles, presentations, posters, prototypes, and reports from reusable templates. People use it to produce HTML and export it to services such as WeChat, X, and Zhihu or to HTML and PNG files. The catalogue entries are the skills and instructions that define its output surfaces and workflows.
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 skills add nexu-io/html-anything --skill social-x-post-cardgit clone --depth 1 https://github.com/nexu-io/html-anythingWrote 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/nexu-io/html-anything/social-x-post-card)<a href="https://agentmods.dev/skills/nexu-io/html-anything/social-x-post-card"><img src="https://agentmods.dev/badge/skills/nexu-io/html-anything/social-x-post-card/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/nexu-io/html-anything/social-x-post-card"><img src="https://agentmods.dev/badge/skills/nexu-io/html-anything/social-x-post-card.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector pass
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.00033 | $0.00893 |
| Opus 5 | $0.00016 | $0.00447 |
| Sonnet 5 | $0.00007 | $0.00179 |
| Haiku 4.5 | $0.00003 | $0.00089 |
Grade A, and why
social-x-post-card scanned grade A with 0 findings 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 7d 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.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
What it actually says
【模板: X (Twitter) 帖子卡】 【意图】把一段推文内容 (或用户的金句) 渲染成一张拟真度极高的 X 帖子卡片, 用于视频叠加、推特发图、知识沉淀。Inspired by hyperframes x-post。
【画布】1280×720 或 1080×1080, 暗背景 #0f1419 或亮背景 #ffffff (按 X 主题); 卡片居中, 阴影柔和。
【卡片结构】
- 外框: 圆角 16px, 1px border
#2f3336(dark) /#eff3f4(light), 内边距 16px。 - 顶部 row: 头像 (48×48 圆形, 用 CSS gradient 占位) + 用户名 + handle
@username+ verified 蓝勾 + 时间 (mono, 12px, 灰)。 - 正文: 17-22px, 字重 400; 链接用 X 蓝
#1d9bf0; hashtag 同色; mention 同色; 段落间空 0.6em。 - 可选: 引用卡 (小卡内嵌, 灰底, 圆角 12px)。
- 可选: 1 张图 (CSS 渐变 + 描述占位, 不能外链图片), 比例 16:9, 圆角 12px。
- 互动 row: 4 个 icon + 数字 (回复 / 转推 / 引用 / 点赞), icon 用 inline SVG (X 官方风格), 灰色, hover 时变色。
- 顶部右上 X logo 单线 SVG。
- 浏览量 row: 👁️ + 数字 (小字)。
【字体】
- 西文:
Chirp(X 的字体) → fallbackInter或Segoe UI。 - 中文:
Noto Sans SC/PingFang SC。 - 数字: 同主字体, 不用 mono。
【设计细节】
- 配色 light: bg
#fff, text#0f1419, secondary#536471, border#eff3f4, accent#1d9bf0。 - 配色 dark (推荐, 视频叠加用): bg
#000, text#e7e9ea, secondary#71767b, border#2f3336, accent#1d9bf0。 - 数字格式化: 1.2K / 4.5M (不要原始 1234)。
- 内容必须来自用户输入, 不能编造推文。
- 若用户输入是数据 → 自动总结成一句"金句"推文 (≤ 280 字符)。
- 单文件 HTML; icon 内联 SVG; 不要任何外部图片 URL。
- 可选: 卡片背后加微妙径向高光
radial-gradient(...)增加视频叠加的可读性。
What ships with it
2 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
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.
- 7d ago First seen · 49 lines · 33 tokens per session scan A 4d0679eaf973
social-x-post-card is a skill published in the GitHub repository nexu-io/html-anything (8,731 stars, last pushed 19d ago), licensed Apache-2.0. It adds 33 tokens to every session and 893 once invoked, about $0.0002 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-03.
Other skills, from other repositories
social-x-post-card
Realistic X post card with engagement metrics (likes, reposts, views), suited to video overlays or shareable image cards.
frame-macos-notification
Realistic macOS notification banner with app icon, title, and body, suited to video overlays or product teasers.
social-reddit-card
Realistic Reddit post card with vote rail and comment count, suited to video overlays or story sharing.
card-twitter
Twitter quote or data card designed to pair with a post.
social-x-post-card
Realistic X post card with engagement metrics (likes, reposts, views), suited to video overlays or shareable image cards.
social-x-post-card
Realistic X post card with engagement metrics (likes, reposts, views), suited to video overlays or shareable image cards.