Star 历史趋势
数据来源: GitHub API · 生成自 Stargazers.cn
README.md

HTML Anything

From the team behind Open Design40k★ · 200+ contributors, production-grade and iterating faster. html-anything is the focused agent-era HTML editor; if it clicks for you, Open Design is where the same team ships at scale.

Markdown is the draft. HTML is what humans read. Your local agent writes it. The agentic HTML editor — in the agentic era, you don't hand-edit docs anymore, so the output format should be what the reader actually wants: HTML. Local-first, zero API key, reuses the CLI session you already have logged in — 8 coding-agent CLIs auto-detected on your PATH (Claude Code · Cursor Agent · Codex · Gemini CLI · GitHub Copilot CLI · OpenCode · Qwen Coder · Aider), driven by 75 composable skill templates across 9 deliverable surfaces (magazine articles · keynote decks · résumés · posters · Xiaohongshu cards · tweet cards · web prototypes · data reports · Hyperframes videos). One-click export to WeChat / X / Zhihu, or download .html / .png.

HTML Anything — the agentic HTML editor, on your laptop

License Agents Skills Export Quickstart No API key

Discord (open-design) Follow @nexudotio on X open-design release open-design commits / month Design systems Built on open-design

English · 简体中文


Showcase

The eight skills that surface at the top of the picker's Featured / 推荐 group — sorted by their recommended: rank in SKILL.md frontmatter (lower = higher). Each ships a real example.html you can open straight from the repo, no auth, no setup.

deck-guizang-editorial
deck-guizang-editorial · deck · recommended: 1
Magazine × e-ink editorial deck, inspired by op7418/guizang-ppt-skill — 10 locked layouts × 5 palettes (Ink / Indigo Porcelain / Forest Ink / Kraft / Dune). Reads like a printed art-zine, not a slide deck.
deck-swiss-international
deck-swiss-international · deck · recommended: 2
Swiss International deck — 16-column grid + one saturated accent (Klein Blue / Lemon / Mint / Safety Orange) across 22 locked layouts. Cold, rational, institutional. The deck that reads "a designer made this" the moment it opens.
doc-kami-parchment
doc-kami-parchment · doc · recommended: 3
Warm-parchment editorial document, inspired by tw93/kami. #f5f4ed ground + ink-blue accent + single serif voice — a noticeably calmer reading surface than plain-white markdown for long essays, reports, and one-pagers.
magazine-poster
magazine-poster · poster · recommended: 4
Newsprint Sunday-paper poster — oversized serif headline, two-column body, six numbered sections, dot-pattern cream ground. Reads like a printed broadsheet, not a webpage.
video-hyperframes
video-hyperframes · frame / video · recommended: 5
Hyperframes / Remotion-compatible storyboard — 6–10 sequential 1920×1080 frames with hidden duration + transition markers and an auto-play script. Hand straight to heygen-com/hyperframes or Remotion to render .mp4.
frame-glitch-title
frame-glitch-title · frame · recommended: 6
Glitch title frame — cyan/magenta chromatic offset, CRT scanlines, corrupted-data subtitle, ASCII noise in the corners. Cyberpunk hero card or video transition.
vfx-text-cursor
vfx-text-cursor · vfx · recommended: 7
VFX text-cursor opener — a cursor "types" across the canvas, each character revealed with a hot-pink × cyan chromatic trail and directional light leaks. Drop in a quote, get a film-grade opening frame.
frame-logo-outro
frame-logo-outro · frame · recommended: 8
Logo outro frame — logo assembles piece-by-piece with glow bloom, tagline rises, CTA appears. The closing card for a product reveal or brand film.

The full skill catalog (organized by mode) is in Skills below.

Why this exists

Anthropic's Claude Code team announced they stopped writing internal docs in Markdown — they ship HTML now. The argument is simple:

MarkdownHTML
Good for the writerGood for the reader
Layout limited to the rendererLayout is yours
Looks ugly screenshotted into a tweetAlready looks like a designed image
Has to be re-flowed for WeChat / Zhihu / newsletterOne-click format conversion

HTML is the final form for humans. Markdown is just an intermediate state during writing.

But "writing HTML" used to mean writing CSS, picking type scales, snapping to a grid, doing responsive — most users won't, designers won't bother, writers don't have the patience. So what we built: after you press ⌘+Enter, your local AI agent turns any input (Markdown / CSV / Excel / JSON / SQL / raw notes) into a ship-ready single-file HTML in seconds, then one-click sends it to WeChat / X / Zhihu / anywhere. "Ship-ready" is the bar — when generation finishes, the artifact is what your audience actually sees. No "I'll touch it up later" pass.

We stand on four open-source shoulders:

  • nexu-io/open-design — the agent-detection layer, the design-system model, and the SKILL.md protocol. src/lib/agents/ and src/lib/templates/skills/* mirror this architecture directly.
  • mdnice/markdown-nice — proof that juice-inlined CSS pastes cleanly into WeChat and Zhihu without per-platform manual fix-up.
  • gcui-art/markdown-to-image — the iframe → high-DPI PNG export path.
  • alchaincyf/huashu-md-html — the anti-AI-slop discipline that maps into the hard constraints inside every SKILL.md (CJK-first font stack, 8 px baseline grid, contrast ≥ 4.5, must-use-real-data rule).

At a glance

What you get
Coding-agent CLIs (8)Claude Code · Cursor Agent · OpenAI Codex · Gemini CLI · GitHub Copilot CLI · OpenCode · Qwen Coder · Aider — scanned on startup across PATH (including ~/.local/bin, ~/.bun/bin, /opt/homebrew/bin, ~/.npm-global/bin — directories a GUI-launched Node process normally misses), swap from the top-bar picker.
Zero API keyWe reuse the session you already have logged in via claude login · cursor login · gemini auth. Your existing subscription does the work; marginal cost is $0.
75 skill templatesprototype (web / SaaS landing / dashboard / data report) · deck (20 keynote skills incl. Swiss International, Guizang Editorial, XHS Pastel, Hermes Cyber, Replit, Magazine Web…) · frame (10 Hyperframes video frames — liquid hero, NYT data chart, sticky-note flowchart, glitch title, cinema light-leak, macOS notification, logo outro…) · social (X / Xiaohongshu / Spotify / Reddit cards) · office (PM spec · eng runbook · finance report · HR onboarding · invoice · OKRs · weekly update · meeting notes · kanban) · doc (Kami warm-parchment editorial) · mockup (3D device frame) · vfx (text-cursor effect).
9 surface modes📖 magazine article · 🎬 keynote deck · 📄 résumé · 🖼️ poster · 📱 Xiaohongshu card · 🐦 tweet card · 🛠️ web prototype · 📊 data report · 🎞️ Hyperframes video. Each has multiple skills you can pick from.
One-click exportjuice inlines CSS → WeChat paste with zero re-formatting · modern-screenshot renders the iframe to a 2× PNG → ClipboardItem → drop straight into the tweet composer · <mjx-container>data-eeimg placeholder → Zhihu equations render automatically · standalone .html download · high-DPI .png download.
Streaming renderPOST /api/convert over SSE. The agent's stdout JSON-line stream is parsed for text deltas → server-sent events → client appends → iframe srcdoc updates live. Waiting for an AI generation looks like watching it type in real time.
Sandboxed preview<iframe sandbox="allow-scripts allow-same-origin">. User-emitted HTML runs in an isolated origin — Tailwind CDN / Google Fonts / inline scripts work, but cookies and localStorage are quarantined from the host.
Format auto-detectThe editor accepts Markdown / CSV / TSV / JSON / SQL / plain text. papaparse + xlsx parse tabular data in the browser — nothing is uploaded.
Deployable toLocal (pnpm dev) · Vercel for the web layer (the agent always stays on your laptop).
LicenseApache-2.0

Demo

01 · Entry view
Entry view — the top bar shows your installed CLIs, the left pane is the editor, the middle is the template + design-system picker, the right is a live iframe preview. The same surface produces magazines, decks, posters, web prototypes, and Hyperframes frame scripts.
02 · 75 skills, searchable and filterable
75 templates, searchable and filterable — pick by mode (prototype / deck / frame / social / office / doc) × scenario (design / marketing / engineering / product / personal). Every skill ships an example.html you can open straight from the repo to see what the agent will produce.
03 · Live SSE streaming
SSE streaming — agent stdout JSON-line is parsed for text deltas, appended into the iframe srcdoc in real time. You watch the page render line by line. Don't like where it's going? Interrupt and re-prompt — no wasted full generation.
04 · One-click export
One-click export — WeChat (juice-inlined CSS) · X / Weibo / Xiaohongshu (modern-screenshot → 2× PNG → ClipboardItem) · Zhihu (LaTeX image placeholders) · download .html · download .png. Paste straight in, no second pass of manual formatting.
05 · Deck mode
Deck mode — 20 keynote skills, including Swiss International (Helvetica grid maximalism), Guizang Editorial (magazine ink), Open Slide Canvas (1920×1080 agent-native), Magazine Web, XHS Pastel, Hermes Cyber, Replit Style. ←/→ to navigate slides, presenter notes, PDF export.
06 · Hyperframes video frames
Hyperframes frames — 10 motion frame scripts (liquid hero, NYT data chart, sticky-note flowchart, glitch title, cinema light-leak, macOS notification, brand logo outro, text-cursor VFX, 3D device mockup, …) conforming to heygen-com/hyperframes; hand off straight to Remotion to render .mp4.

Quickstart

git clone https://github.com/nexu-io/html-anything cd html-anything pnpm install pnpm dev # → http://localhost:3000

Open the browser → the top bar auto-detects whichever coding-agent CLI you already have signed in → pick a template → paste content → ⌘+Enter.

No API key required. We reuse the session you already have logged in (Claude / Cursor / Codex / Gemini / Copilot subscriptions all work).

Supported coding agents

On startup we scan PATH (including ~/.local/bin, ~/.bun/bin, /opt/homebrew/bin, ~/.npm-global/bin — directories normally missed by GUI-launched Node) and surface every CLI we recognize:

AgentDetection binaryInvocation
Claude Codeclaudeclaude -p --output-format stream-json
OpenAI Codexcodexcodex exec --json --sandbox workspace-write
Cursor Agentcursor-agentcursor-agent --print --output-format stream-json --force --trust
Gemini CLIgeminigemini --output-format stream-json --yolo
GitHub Copilot CLIcopilotcopilot --allow-all-tools --output-format json
OpenCodeopencode-cli / opencodeopencode run --format json --dangerously-skip-permissions -
Qwen Coderqwenqwen --yolo -
Aideraideraider --no-pretty --no-stream --yes-always --message-file -

The detection strategy and per-CLI adapter shape are borrowed directly from nexu-io/open-design and multica-ai/multica: one privileged process spawns CLIs, JSON-line is the wire protocol, every CLI gets a thin adapter in src/lib/agents/argv.ts.

If you've already done claude login / cursor login / gemini auth in your terminal, HTML Anything reuses that session. No second copy of the API key required.

Skills

75 skills under src/lib/templates/skills/, each a folder following the Claude Code SKILL.md convention plus an extended frontmatter (mode · scenario · surface · preview · design_system).

The two axes the picker uses:

  • modeprototype (web / SaaS landing / dashboard / data report / résumé / doc) · deck (20 horizontal-swipe presentations) · frame (10 Hyperframes motion frames) · social (4 social-card formats) · office (PM / engineering / finance / HR / operations document surfaces).
  • scenariodesign · marketing · engineering · product · finance · hr · sale · personal. Used to group skills in the picker.

Web prototypes & marketing pages (prototype mode)

SkillBest forOutput
prototype-webGeneric web prototype (default)Single-page HTML, 1440×900 desktop
saas-landingSaaS landing pageHero / features / pricing / CTA
waitlist-pageWaitlist / early-access pageMinimal form + social proof
pricing-pagePricing pageMulti-tier comparison tables
dashboardAdmin / analytics consoleSidebar + dense data layout
docs-pageTechnical documentation3-column docs layout
blog-postLong-form blog postEditorial layout
mobile-appiOS / Android prototypeiPhone 15 Pro chrome
mobile-onboardingApp onboarding flowSplash · value · sign-in trio
gamified-appGamified appQuest · XP · level trio
dating-webDating / matchmaking dashboardLeft rail · KPIs · 30-day chart
magazine-posterSingle-page magazine poster1080×1920
poster-heroMarketing posterSingle-page display poster
web-proto-editorialEditorial-style webSerif display + grid
web-proto-brutalistBrutalist webHard edges, black & white, anti-grid
web-proto-softSoft / warm webSoft shadows, rounded, warm palette
article-magazineLong-form magazine articleA4 / long-page
digital-eguideDigital e-guideCover + lesson spread
resume-modernMinimal résuméA4 210×297mm
email-marketingBrand product-launch emailCenter single-column, table fallback
wireframe-sketchHand-drawn wireframeEarly-pass ideation

Decks (deck mode, 20 skills)

SkillBest for
deck-swiss-internationalSwiss International deck
deck-guizang-editorialEditorial-ink deck (from op7418/guizang-ppt-skill)
deck-open-slide-canvas1920×1080 agent-native canvas (from 1weiho/open-slide)
deck-magazine-webMagazine-style web deck
deck-hermes-cyberHermes Cyber neon-luxe
deck-replitReplit-style product walkthrough
deck-xhs-pastelXiaohongshu pastel deck
deck-xhs-whiteXiaohongshu pure-white deck
deck-xhs-postXiaohongshu single-post deck
deck-tech-sharingTech-sharing deck
deck-product-launchProduct-launch event deck
deck-pitchInvestor pitch
deck-blueprintBlueprint / roadmap
deck-presenter-modeSpeaker-notes-aware
deck-course-moduleCourse module deck
deck-dir-key-navDirectional key-nav deep browse
deck-graphify-darkDark, data-graphic-heavy deck
deck-obsidian-claudeObsidian / Claude-flavored notes
deck-safety-alertIncident / safety briefing
deck-simpleMinimal horizontal-swipe deck

Hyperframes video frames & VFX & device mockups (frame / vfx / mockup, 12 skills)

SkillBest for
frame-liquid-bg-heroLiquid background hero
frame-data-chart-nytNYT-style data chart
frame-flowchart-stickySticky-note flowchart
frame-glitch-titleGlitch title card
frame-light-leak-cinemaCinema light-leak
frame-macos-notificationmacOS notification toast
frame-logo-outroBrand logo outro
motion-framesGeneric motion-design frame
video-hyperframesHyperframes frame-script schema
sprite-animationPixel / 8-bit animation
vfx-text-cursorText-cursor VFX
mockup-device-3d3D device-frame mockup

Frame scripts conform to the heygen-com/hyperframes spec and hand off straight to remotion-dev/remotion to render .mp4.

Social share cards (social mode)

SkillBest for
social-x-post-cardX / Twitter quote card (1600×900)
social-spotify-cardSpotify-Wrapped style card
social-reddit-cardReddit thread card
social-carousel3-card 1080×1080 carousel
card-xiaohongshuXiaohongshu image-with-text card
card-twitterTwitter pull-quote card
social-media-dashboardSocial-ops dashboard
social-media-matrixMulti-platform content matrix

Office & operations (office / doc mode)

SkillScenarioBest for
doc-kami-parchmentpersonalWarm-parchment editorial doc (from tw93/kami)
pm-specproductPM spec doc + decision log
team-okrsproductOKR scoresheet
meeting-notesoperationMeeting decision log
weekly-updateoperationTeam weekly cadence
kanban-boardoperationBoard snapshot
eng-runbookengineeringIncident runbook
finance-reportfinanceExec finance summary
invoicefinanceSingle-page invoice
hr-onboardinghrRole onboarding plan
data-reportfinance / productCSV/Excel → visual data report
live-dashboardoperationLive data dashboard
flowai-team-dashboardoperationTeam workflow dashboard
ppt-keynotepersonalGeneric Keynote-style deck

Adding a skill takes one folder. Copy a similar skill, edit its SKILL.md frontmatter, restart pnpm dev, the picker shows it. See CONTRIBUTING.md for the bar a skill PR has to clear before we merge.

Six load-bearing ideas

1 · We don't ship an agent. Yours is good enough.

On boot the browser calls /api/agents. The server scans PATH — including the dirs a GUI-launched Node usually misses (~/.local/bin, ~/.bun/bin, /opt/homebrew/bin, ~/.npm-global/bin) — and surfaces whichever CLIs it finds. Each CLI has one adapter (argv + stdin protocol + stream parser) in src/lib/agents/argv.ts. The whole detection model is borrowed directly from nexu-io/open-design and multica-ai/multica: one privileged process spawns CLIs, JSON-line is the wire protocol.

2 · Skills are folders, not plugins.

Following Claude Code's SKILL.md conventionSKILL.md + assets/ + references/ + example.html. Drop a folder into src/lib/templates/skills/, restart pnpm dev, the picker shows it. deck-guizang-editorial is vendored directly from op7418/guizang-ppt-skill with original LICENSE and authorship preserved.

3 · Hard constraints stop the model from freestyling.

Every template hardcodes:

  • CJK-first font stackNoto Sans/Serif SC / source-han for Chinese, Inter / Manrope for Latin.
  • 8 px baseline grid — every spacing, line-height, font-size is a multiple of 8.
  • Rounded corners · soft shadow · no pure black / pure white — visual de-slop-ification.
  • Color contrast ≥ 4.5, every interactive element has a real :focus state.
  • Must use the user's real data, no lorem ipsum.

The discipline is lifted from alchaincyf/huashu-design's Junior-Designer mode + anti-AI-slop checklist. Constraints belong in the prompt — every SKILL.md writes them in.

4 · Streaming render = watch the AI draw.

POST /api/convert is SSE. The agent's stdout is line-delimited JSON; the server pulls out the text deltas and re-emits them as SSE events; the client appends to the iframe's srcdoc. The whole experience is the same as watching the agent type in a terminal, except the artifact is HTML, not Markdown. Interrupt at any time — you're not paying for a whole generation you don't want.

5 · One-click export = zero second-pass formatting.

  • WeChat MPjuice inlines CSS + data-tool markers → paste into the editor, styles survive end to end.
  • X / Weibo / Xiaohongshumodern-screenshot renders the iframe to a 2× PNG → ClipboardItem → drop straight into the composer.
  • Zhihu — same as above, plus <mjx-container> is replaced with data-eeimg LaTeX-image placeholders (Zhihu won't render KaTeX live — math has to be an image).
  • Download .html / download .png — self-contained single file, shareable anywhere.

Mechanically inspired by mdnice/markdown-nice and gcui-art/markdown-to-image.

6 · Sandboxed iframe = secure + isolated.

User-emitted HTML always renders inside <iframe sandbox="allow-scripts allow-same-origin">. Third-party scripts (Tailwind CDN, Google Fonts, custom animations) still execute, but cookies and localStorage stay in the iframe's own origin — the host page is never poisoned. Opening devtools only shows the iframe's DOM, so the debugging experience matches a standalone HTML file.

Architecture

┌─────────────────────── Browser (Next.js 16) ──────────────────────┐
│  Editor / upload · top-bar agent picker · template picker · iframe │
└─────────────┬──────────────────────────────────┬──────────────────┘
              │ ⌘+Enter                            │
              ▼                                    ▼
     ┌─────────────────────┐            ┌──────────────────────┐
     │  GET /api/agents    │            │  POST /api/convert   │
     │  scan PATH, list    │            │  SSE — spawn CLI     │
     │  installed CLIs     │            │  pipe stdin / stdout │
     └─────────────────────┘            └──────────┬───────────┘
                                                   │ spawn + stdin pipe
                                                   ▼
                                ┌────────────────────────────────────┐
                                │  Your local coding-agent CLI       │
                                │  claude / codex / cursor-agent /   │
                                │  gemini / copilot / opencode /     │
                                │  qwen / aider                      │
                                │  → reuses your existing session    │
                                └────────────────────────────────────┘
                                                   │
                                                   ▼
                                stdout JSON-line ──► SSE event
                                                   │
                                                   ▼
                              iframe srcdoc append (live)
                                                   │
                              ⌘+C copy → ClipboardItem
                              ⌘+S download → .html / .png
LayerStack
FrontendNext.js 16 App Router + Turbopack · React 19 · Tailwind v4 · zustand state
Server routesGET /api/agents (detection) · POST /api/convert (SSE streaming spawn)
Agent transportchild_process.spawn · one stdin/stdout adapter per CLI (src/lib/agents/argv.ts)
Browser-side processingjuice (CSS inlining) · modern-screenshot (PNG export) · xlsx / papaparse (spreadsheet parsing) · marked + highlight.js (Markdown-compatible input) · dompurify (XSS defense)
Preview sandboxiframe[sandbox="allow-scripts allow-same-origin"] + srcdoc
Export targets.html standalone · .png high-DPI · ClipboardItem (text/html + image/png) · WeChat-compatible inlined CSS
DeployLocal pnpm dev · Vercel one-click for the web layer (agent stays local)

Export targets

PlatformImplementationPaste behavior
WeChat MPjuice inlines CSS + data-tool markersPaste into editor, zero re-formatting
ZhihuSame as WeChat + <mjx-container>data-eeimg LaTeX image placeholderEquations render after upload
X / Weibo / Xiaohongshumodern-screenshot → 2× PNG → ClipboardItemDrop straight into the composer
Download .htmlSingle-file, inlined assetsOpen anywhere with a browser
Download .pngHigh-DPI screenshotShare anywhere

Roadmap

  • Multi-template compare preview — generate four candidates of the same brief, pick the best one
  • Hyperframes → mp4 — one-click hand-off of frame scripts to Remotion for real video output
  • Shared design systems — interop with nexu-io/open-design DESIGN.md assets
  • Template marketplace — community-contributed prompts & examples
  • Browser extension — select on any page → convert to HTML template
  • History / version diff / IndexedDB archive
  • More export targets — WeChat Channels · Douyin captions · Notion · Linear · Telegraph

Status

Early but real. The closed loop — detect agent → pick skill → SSE stream → sandboxed iframe preview → one-click export — runs end-to-end against all 8 CLIs listed above. The skill library and the SKILL.md hard-constraints are where most of the leverage lives, and both are stable. The picker UX, design-system metadata, and the multi-template compare flow ship daily. If something looks broken on your machine, open an issue with the agent CLI you were using and the input — those are the bug reports that move things forward fastest.

SurfaceState
Agent detection (8 CLIs)✅ stable
Skill registry + picker (75 skills)✅ stable
SSE streaming render✅ stable
Sandboxed iframe preview✅ stable
One-click WeChat / X / Zhihu / .html / .png export✅ stable
CSV / Excel / JSON / SQL format auto-detect✅ stable
Multi-template compare (generate 4, pick 1)🛠 in progress
Hyperframes → .mp4 one-click handoff to Remotion🛠 in progress
Browser extension (select on any page → convert)⏳ planned
History / version diff / IndexedDB archive⏳ planned
Skill marketplace (install <github-repo>)⏳ planned

Contributing

Issues, PRs, new skills, new agent adapters, new export targets, and translations are all welcome. The highest-leverage contributions are usually one folder, one Markdown file, or one PR-sized adapter — small surface area, big leverage. Pick the slot that matches what you want to add:

  • Add a skill — drop a folder into src/lib/templates/skills/ with SKILL.md + example.html (+ optional assets/ and references/). The picker auto-discovers it after pnpm dev restart. The SKILL.md frontmatter has to set mode · scenario · surface · preview · design_system — copy a neighbour and edit.
  • Wire up a new coding-agent CLI — one entry in src/lib/agents/argv.ts covering: detection binary, argv builder, stdin/stdout protocol, stream parser. Detection is exercised by src/app/api/agents/ and the spawn loop by src/app/api/convert/.
  • Add an export target — drop a module under src/lib/export/ (next to wechat.ts / image.ts / clipboard.ts) and add the button to the export menu. WeChat Channels · Douyin captions · Notion · Linear · Telegraph · RSS are all open.
  • Sharpen a SKILL.md — strengthen the hard-constraints (CJK font stack, 8 px baseline, contrast ≥ 4.5, must-use-real-data), add a 5-dimensional self-critique, swap in a better palette. Anti-AI-slop discipline is the most underrated PR shape we accept.
  • Translations & docsREADME.zh-CN.md and CONTRIBUTING.zh-CN.md are kept in parallel with the English files; please update both.

Full walkthrough, bar-for-merging, code style, and what we don't accept → CONTRIBUTING.md (简体中文).

References & lineage

Every external project this repo borrows from — what we take from each, and where it lands in the tree.

ProjectRole here
nexu-io/open-designThe agent-detection layer, the DESIGN.md design-system schema, and the SKILL.md skill protocol. src/lib/agents/argv.ts and src/lib/templates/skills/ mirror this architecture verbatim.
multica-ai/multicaDaemon-and-runtime architecture: one privileged process spawns CLIs, JSON-line is the wire protocol, every CLI gets a thin per-adapter shape.
alchaincyf/huashu-designAnti-AI-slop discipline — Junior-Designer mode, 5-step brand-asset protocol, contrast-≥-4.5 / 8 px baseline-grid / must-use-real-data rules. Hard-coded into every SKILL.md frontmatter.
alchaincyf/huashu-md-htmlProof that end-to-end WeChat / Zhihu paste-compatibility is solvable. Reference for src/lib/export/wechat.ts.
mdnice/markdown-nicejuice-inlined-CSS pipeline → WeChat / Zhihu paste with zero re-formatting. Drives src/lib/export/wechat.ts.
mdnice/markdown-resumeA4-formatted résumé inspiration → resume-modern.
gcui-art/markdown-to-imageiframe → high-DPI PNG export, replicated with modern-screenshot in src/lib/export/image.ts.
op7418/guizang-ppt-skillMagazine-ink editorial deck integrated verbatim as deck-guizang-editorial and the Swiss variant deck-swiss-international. Original LICENSE + authorship preserved.
tw93/kamiWarm-parchment monochrome editorial document system → doc-kami-parchment.
1weiho/open-slide1920×1080 agent-native canvas convention → deck-open-slide-canvas.
heygen-com/hyperframesFrame-script schema for the entire frame-* / vfx-* / mockup-* / social-* family. Output hands straight off to Remotion to render .mp4.
remotion-dev/remotionTarget renderer for Hyperframes frame scripts.
jimliu/baoyu-skillsPractical skills collection — reference catalog for picker categorization.

Each bundled upstream skill retains its original LICENSE and authorship inside its own src/lib/templates/skills/<skill>/ folder.

Stay in the loop

Follow @nexudotio on X for release notes, new skills, and the occasional behind-the-scenes thread on what's shipping next. The Discord is where the bigger conversations happen — both are run by the upstream open-design team, and HTML Anything piggybacks on the same channels.

Contributors

Thanks to everyone who has filed an issue, opened a PR, or added a skill / agent adapter / export target. Every real contribution counts, and the wall below is the easiest way to say so out loud.

HTML Anything contributors

If you've shipped your first PR — welcome. The good-first-issue / help-wanted labels are the entry point.

Star History

HTML Anything star history

If the curve bends up, that's the signal we look for. ★ this repo to push it.

License

Apache-2.0 © 2026 HTML Anything contributors. See LICENSE.

Bundled work retains its original license and authorship attribution — see the per-skill LICENSE / README.md inside each src/lib/templates/skills/<skill>/ folder for what it inherits from upstream.

关于 About

✨ 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 / Gemini / Copilot / OpenCode / Qwen / Aider.
agent-skillsagenticai-agentsai-designai-editorbyokclaudeclaude-codeclaude-skillscoding-agentsgenerative-aihtmlhtml-editorhyperframeslocal-firstmarkdownnextjsvibe-codingwechatxiaohongshu

语言 Languages

HTML72.1%
TypeScript27.5%
CSS0.4%
JavaScript0.0%

提交活跃度 Commit Activity

代码提交热力图
过去 52 周的开发活跃度
9
Total Commits
峰值: 9次/周
Less
More

核心贡献者 Contributors