Menu

#156 by GitHub stars

nexu-io/html-anything

✨ 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) 🛡<U+FE0F> Sandboxed preview · 📤 1-click to WeChat / X / Zhihu / HTML / PNG 🔑 Zero API key — Claude Code / Cursor / Codex / Gemini / Copilot / OpenCode / Qwen / Aider.

Claude CodeCodexEngineeringDesignData

History

Review weekly changes to SKILL.md before updating. Dates mark the weeks in which we observed each version; checks apply to the recorded commits.

View weekly changes

next/src/lib/templates/skills/article-magazine/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/article-sketchnote-editorial/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/blog-post/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/card-twitter/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/card-xiaohongshu/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/competitive-teardown/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/dashboard/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/data-report/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/dating-web/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-blueprint/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-course-module/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-dir-key-nav/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-graphify-dark/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-guizang-editorial/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-hermes-cyber/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-ljg-present/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-magazine-web/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-obsidian-claude/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-open-slide-canvas/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-pitch/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-presenter-mode/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-product-launch/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-replit/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-safety-alert/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-simple/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-swiss-international/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-tech-sharing/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-xhs-pastel/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-xhs-post/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/deck-xhs-white/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/digital-eguide/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/doc-kami-parchment/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/docs-page/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Network or broad shell → After Network or broad shell

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Network or broad shell

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/email-marketing/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/eng-runbook/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/exec-briefing-memo/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/experiment-readout/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/finance-report/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/flowai-team-dashboard/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/frame-data-chart-nyt/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Network or broad shell

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/frame-flowchart-sticky/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/frame-glitch-title/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/frame-light-leak-cinema/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/frame-liquid-bg-hero/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/frame-logo-outro/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/frame-macos-notification/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/gamified-app/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/hr-onboarding/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/info-funnel/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/invoice/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/kanban-board/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/live-dashboard/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/magazine-poster/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/meeting-notes/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/mobile-app/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/mobile-onboarding/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/mockup-device-3d/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/motion-frames/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/pm-spec/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/poster-hero/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/ppt-keynote/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/pricing-page/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/prototype-web/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/resume-modern/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/saas-landing/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/social-carousel/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/social-media-dashboard/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/social-media-matrix/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/social-reddit-card/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/social-spotify-card/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/social-x-post-card/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/sprite-animation/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/team-okrs/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/vfx-text-cursor/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/video-hyperframes/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/waitlist-page/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/web-proto-brutalist/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/web-proto-editorial/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/web-proto-soft/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/weekly-update/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

next/src/lib/templates/skills/wireframe-sketch/SKILL.md

Week of Nov 2, 2026 · +0 / −0 lines

Before Instructions only → After Instructions only

975fb3bcb98f → 975fb3bcb98f

Compare on GitHub

Week of Oct 26, 2026 · Line counts unavailable

Before Not checked yet → After Instructions only

First observation → 975fb3bcb98f

No earlier version was observed for comparison.

Compare on GitHub

View on GitHubAdd to my skills

Verified commit 975fb3bcb98f1777781fb4c738902d36e32c8c46

git clone --filter=blob:none --no-checkout https://github.com/nexu-io/html-anything.git .hotskills/nexu-io-html-anything && git -C .hotskills/nexu-io-html-anything checkout --detach 975fb3bcb98f1777781fb4c738902d36e32c8c46 # Copy each selected skill directory from .hotskills/nexu-io-html-anything into .claude/skills/<skill-name>/
git clone --filter=blob:none --no-checkout https://github.com/nexu-io/html-anything.git .hotskills/nexu-io-html-anything && git -C .hotskills/nexu-io-html-anything checkout --detach 975fb3bcb98f1777781fb4c738902d36e32c8c46 # Copy each selected skill directory from .hotskills/nexu-io-html-anything into .agents/skills/<skill-name>/
9.4kGitHub stars
107stars in 7 days
81skills in this repository
4commits in 30 days

Heat

7.0
  • Star growth, last 7 daysAhead of 86% of tracked repositories
  • Star growth, last 24 hoursAhead of 85% of tracked repositories
  • Rank movement, last 7 daysAhead of 74% of tracked repositories
  • Commits, last 30 daysAhead of 67% of tracked repositories
  • Accounts asking about it through MCP, last 7 daysNot available
  • Hot votes this weekAhead of 0% of tracked repositories

Heat never changes the order by stars, and sponsorship never touches it. How heat works

Stars over time

Aug 2, 2026Nov 6, 20269,437

Individual skills in this repository

How it works

article-magazine

When your agent uses it

Substack / Medium 高级感长文排版, 适合公众号、博客发布

What it loads into context

Frontmatter

203 tokens

Always available to the agent

SKILL.md

412 tokens

When the skill is activated

Reference documents

618 tokens

Loaded on request

Token counts are estimates. Scripts run separately; they are not counted as reference context.

The playbook

    Files

    • SKILL.mdcore1,399 bytes
    • example.htmlasset7,130 bytes
    • example.mddoc2,097 bytes
    Read SKILL.md
    
【模板: 杂志文章】
- 顶部 hero: 大标题 (text-5xl/6xl) + 可选副标题 + 作者 / 阅读时间 / 日期元数据。
- 正文: 单栏, 最大宽度约 700px, 居中。段落 `text-lg leading-relaxed text-neutral-700 dark:text-neutral-300`。
- H2 / H3 标题用 serif 字体, 让正文与标题有视觉对比。
- 引用块使用左侧粗 accent 色边线 + 斜体。
- 代码块: 圆角 + 深色背景 + 浅色文字, 显示语言标签。
- 列表项使用自定义 bullet（小方块 / accent 圆点）。
- 章节之间用 `<hr>` 分隔, 但样式做成中央居中的小 ornament。
- 文末加一个简单的 "如果觉得有用，欢迎转发" 行动卡片。
    View the complete source on GitHub

    Skills included

    • article-magazine
    • article-sketchnote-editorial
    • blog-post
    • card-twitter
    • card-xiaohongshu
    • competitive-teardown
    • dashboard
    • data-report
    • dating-web
    • deck-blueprint
    • deck-course-module
    • deck-dir-key-nav
    • deck-graphify-dark
    • deck-guizang-editorial
    • deck-hermes-cyber
    • deck-ljg-present
    • deck-magazine-web
    • deck-obsidian-claude
    • deck-open-slide-canvas
    • deck-pitch
    • deck-presenter-mode
    • deck-product-launch
    • deck-replit
    • deck-safety-alert
    • deck-simple
    • deck-swiss-international
    • deck-tech-sharing
    • deck-xhs-pastel
    • deck-xhs-post
    • deck-xhs-white
    • digital-eguide
    • doc-kami-parchment
    • docs-page
    • email-marketing
    • eng-runbook
    • exec-briefing-memo
    • experiment-readout
    • finance-report
    • flowai-team-dashboard
    • frame-data-chart-nyt
    • frame-flowchart-sticky
    • frame-glitch-title
    • frame-light-leak-cinema
    • frame-liquid-bg-hero
    • frame-logo-outro
    • frame-macos-notification
    • gamified-app
    • hr-onboarding
    • info-funnel
    • invoice
    • kanban-board
    • live-dashboard
    • magazine-poster
    • meeting-notes
    • mobile-app
    • mobile-onboarding
    • mockup-device-3d
    • motion-frames
    • pm-spec
    • poster-hero
    • ppt-keynote
    • pricing-page
    • prototype-web
    • resume-modern
    • saas-landing
    • social-carousel
    • social-media-dashboard
    • social-media-matrix
    • social-reddit-card
    • social-spotify-card
    • social-x-post-card
    • sprite-animation
    • team-okrs
    • vfx-text-cursor
    • video-hyperframes
    • waitlist-page
    • web-proto-brutalist
    • web-proto-editorial
    • web-proto-soft
    • weekly-update
    • wireframe-sketch

    Repository facts

    License
    Apache-2.0
    Created
    May 11, 2026
    Last pushed
    Oct 13, 2026
    Forks
    904
    Open issues
    32
    Project activity
    Active

    Rank over the last 12 weeks

    Now #156 · best #139 · down 5 in 30 days

    1. #154 on Oct 29
    2. #156 from Oct 30 to Oct 31
    3. #155 on Nov 1
    4. #156 on Nov 2
    5. #157 on Nov 3
    6. #156 since Nov 4
    53 earlier periods
    1. #136 on Aug 2
    2. #137 on Aug 7
    3. #136 on Aug 8
    4. #135 on Aug 9
    5. #139 from Aug 10 to Aug 11
    6. #140 from Aug 12 to Aug 15
    7. #139 on Aug 16
    8. #140 from Aug 17 to Aug 18
    9. #142 from Aug 19 to Aug 20
    10. #141 on Aug 21
    11. #139 on Aug 22
    12. #142 from Aug 23 to Aug 27
    13. #140 from Aug 28 to Aug 31
    14. #141 on Sep 1
    15. #140 on Sep 2
    16. #141 on Sep 3
    17. #140 on Sep 4
    18. #141 on Sep 5
    19. #140 on Sep 6
    20. #141 on Sep 7
    21. #142 from Sep 8 to Sep 10
    22. #141 on Sep 11
    23. #142 from Sep 12 to Sep 13
    24. #143 on Sep 14
    25. #144 on Sep 15
    26. #143 on Sep 16
    27. #145 on Sep 17
    28. #146 on Sep 18
    29. #145 on Sep 19
    30. #146 from Sep 20 to Sep 21
    31. #147 from Sep 22 to Sep 23
    32. #146 on Sep 24
    33. #147 on Sep 25
    34. #148 from Sep 26 to Sep 27
    35. #150 on Sep 28
    36. #151 on Sep 29
    37. #150 on Sep 30
    38. #151 from Oct 1 to Oct 2
    39. #150 on Oct 3
    40. #148 on Oct 4
    41. #151 on Oct 5
    42. #149 on Oct 6
    43. #151 from Oct 7 to Oct 8
    44. #152 from Oct 9 to Oct 10
    45. #153 from Oct 11 to Oct 13
    46. #154 on Oct 14
    47. #153 on Oct 15
    48. #152 on Oct 16
    49. #153 on Oct 17
    50. #154 from Oct 18 to Oct 21
    51. #155 from Oct 22 to Oct 24
    52. #156 on Oct 25
    53. #155 on Oct 28

    Before you install

    Network or broad shell

    Automated signals, not a guarantee

    Checked Nov 2, 2026

    Not fully analyzed: some files were too long, unreadable or missing. This never lowers the level.

    Show 1 note
    • next/src/lib/templates/skills/frame-data-chart-nyt/SKILL.md:1 Analysis incomplete: Referenced executable target unavailable; not analyzed
    Show all 543 signals by file

    next/src/lib/templates/skills/article-magazine/SKILL.md

    • Network accessline 15
      example_tagline: "灵感来自 @trq212 的推文" example_desc: "围绕「AI 时代 HTML > Markdown」的延伸评论, 含原推附注与可点击链接" example_source_url: "https://x.com/trq212/status/2052809885763747935"
    • Network accessline 16
      example_desc: "围绕「AI 时代 HTML > Markdown」的延伸评论, 含原推附注与可点击链接" example_source_url: "https://x.com/trq212/status/2052809885763747935" example_source_label: "@trq212 / x.com"
    • Network accessline 17
      example_source_url: "https://x.com/trq212/status/2052809885763747935"

    next/src/lib/templates/skills/article-magazine/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>我读完 @trq212 那条推之后, 把所有 markdown 都换成了 HTML</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>我读完 @trq212 那条推之后, 把所有 markdown 都换成了 HTML</title> <script src="https://cdn.tailwindcss.com"></script> <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 9
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 10
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&family=Noto+Sans+SC:wght@300;400;500;600&family=Noto+Serif+SC:wght@500;700;900&display=swap" rel="stylesheet">
    • Network accessline 27
      <!-- Source banner — clearly attributes the inspiration -->   <a href="https://x.com/trq212/status/2052809885763747935" target="_blank" rel="noopener" class="!no-underline group block mb-10 rounded-2xl border border-[var(--line)] bg-white/7
    • Network accessline 28
      <a href="https://x.com/trq212/status/2052809885763747935" target="_blank" rel="noopener" class="!no-underline group block mb-10 rounded-2xl border border-[var(--line)] bg-white/70 hover:bg-white transition-colors p-4 flex items-start gap-4"
    • Network accessline 39
      <div class="text-[11px] font-medium tracking-[0.22em] uppercase text-[var(--accent)] mb-5">Essay · 2026.05 · 评论 / 延伸</div>   <h1 class="serif text-[3rem] leading-[1.08] font-black tracking-tight mb-5">     我读完 <a href="https://x.com/trq212/
    • Network accessline 40
      <h1 class="serif text-[3rem] leading-[1.08] font-black tracking-tight mb-5">     我读完 <a href="https://x.com/trq212/status/2052809885763747935" target="_blank" rel="noopener" class="italic font-bold !no-underline" style="color:var(--accent)"
    • Network accessline 41
      我读完 <a href="https://x.com/trq212/status/2052809885763747935" target="_blank" rel="noopener" class="italic font-bold !no-underline" style="color:var(--accent)">@trq212</a> 那条推之后,<br/>
    • Network accessline 74
      <div>       <div class="font-semibold text-[var(--ink)] mb-1">题图致敬: 推文中那个 "everything is HTML" 的瞬间。</div>       <div class="text-[13px] text-[var(--mute)]">阅读原推 → <a href="https://x.com/trq212/status/2052809885763747935" target="_blank" rel
    • Network accessline 75
      <div class="font-semibold text-[var(--ink)] mb-1">题图致敬: 推文中那个 "everything is HTML" 的瞬间。</div>       <div class="text-[13px] text-[var(--mute)]">阅读原推 → <a href="https://x.com/trq212/status/2052809885763747935" target="_blank" rel="noopener"
    • Network accessline 76
      <div class="text-[13px] text-[var(--mute)]">阅读原推 → <a href="https://x.com/trq212/status/2052809885763747935" target="_blank" rel="noopener" style="color:var(--accent)">x.com/trq212/status/2052809885763747935</a></div>

    next/src/lib/templates/skills/article-magazine/example.md

    • Network accessline 3
      > 灵感原文: https://x.com/trq212/status/2052809885763747935
    • Network accessline 28
      灵感来自原推, 加上 Claude Code 团队的实践, 我们做了 [HTML Anything](https://github.com/nexu-io/html-anything)。

    next/src/lib/templates/skills/article-sketchnote-editorial/SKILL.md

    • Network accessline 14
      example_tagline: "还原论失败 → Anderson 1972" example_desc: "一段以「涌现」为终点的概念史专题, 6 个 layout 节奏 = 开阔→紧→紧→爆→开阔→静" example_source_url: "https://github.com/lijigang/ljg-skills/tree/master/skills/ljg-card"
    • Network accessline 15
      example_desc: "一段以「涌现」为终点的概念史专题, 6 个 layout 节奏 = 开阔→紧→紧→爆→开阔→静" example_source_url: "https://github.com/lijigang/ljg-skills/tree/master/skills/ljg-card" example_source_label: "lijigang/ljg-skills · ljg-card"
    • Network accessline 16
      example_source_url: "https://github.com/lijigang/ljg-skills/tree/master/skills/ljg-card"
    • Network accessline 219
      【致谢】 本 skill 改编自 [lijigang/ljg-skills · ljg-card -v sketchnote](https://github.com/lijigang/ljg-skills/tree/master/skills/ljg-card)（v2.3.0）。原版输出 PNG（playwright 截图）, html-anything 版直接输出单文件 HTML, 6 公理 + 6 layout + 4 字族 + 节奏与原版一致。
    • Network accessline 220
      本 skill 改编自 [lijigang/ljg-skills · ljg-card -v sketchnote](https://github.com/lijigang/ljg-skills/tree/master/skills/ljg-card)（v2.3.0）。原版输出 PNG（playwright 截图）, html-anything 版直接输出单文件 HTML, 6 公理 + 6 layout + 4 字族 + 节奏与原版一致。

    next/src/lib/templates/skills/article-sketchnote-editorial/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>涌现的命名 · 复杂系统 1972</title> <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 6
      <title>涌现的命名 · 复杂系统 1972</title> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;700;900&family=Noto+Sans+SC:wght@400;500;700&family=Caveat:wght@500;700&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet">
    • Network accessline 486
      <section class="feature">     <div class="visual">       <svg viewBox="0 0 480 320" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 487
      <div class="visual">       <svg viewBox="0 0 480 320" xmlns="http://www.w3.org/2000/svg">         <g fill="none" stroke="#1F1F1F" stroke-width="1.4">
    • Network accessline 488
      <svg viewBox="0 0 480 320" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 554
      <h3 class="head-sans">把所有蚂蚁的行为相加</h3>       <div class="visual">         <svg viewBox="0 0 720 140" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 555
      <div class="visual">         <svg viewBox="0 0 720 140" xmlns="http://www.w3.org/2000/svg">           <g fill="none" stroke="#1F1F1F" stroke-width="1.2">
    • Network accessline 556
      <svg viewBox="0 0 720 140" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 594
      <div class="right">         <div class="visual">           <svg viewBox="0 0 360 220" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 595
      <div class="visual">           <svg viewBox="0 0 360 220" xmlns="http://www.w3.org/2000/svg">             <g fill="none" stroke="#1F1F1F" stroke-width="1.3">
    • Network accessline 596
      <svg viewBox="0 0 360 220" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 621
      <div class="layout">       <div class="visual">         <svg viewBox="0 0 520 320" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 622
      <div class="visual">         <svg viewBox="0 0 520 320" xmlns="http://www.w3.org/2000/svg">           <g fill="none" stroke="#1F1F1F" stroke-width="1.2">
    • Network accessline 623
      <svg viewBox="0 0 520 320" xmlns="http://www.w3.org/2000/svg">

    next/src/lib/templates/skills/card-twitter/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Twitter 分享卡 · 金句</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Twitter 分享卡 · 金句</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@600;700;800&family=Noto+Serif+SC:wght@500;700;900&family=JetBrains+Mono:wght@400;500&d
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@600;700;800&family=Noto+Serif+SC:wght@500;700;900&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/card-xiaohongshu/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>5 个让你的 AI 编辑用得更顺手的小习惯</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>5 个让你的 AI 编辑用得更顺手的小习惯</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;900&family=Inter:wght@500;600;700&display=swap" rel="stylesheet"
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;900&family=Inter:wght@500;600;700&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/competitive-teardown/assets/analyst-dossier.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Competitive Teardown · Analyst Dossier</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Competitive Teardown · Analyst Dossier</title>   <script src="https://cdn.tailwindcss.com"></script>   <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:wght@500;700&family=Inter:wght@400;600;800&display=swap" rel="
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:wght@500;700&family=Inter:wght@400;600;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/competitive-teardown/assets/radar-map.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Competitive Teardown · Radar Map</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Competitive Teardown · Radar Map</title>   <script src="https://cdn.tailwindcss.com"></script>   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap" rel="stylesheet">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/competitive-teardown/assets/war-room-grid.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Competitive Teardown · AI Meeting Assistants</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Competitive Teardown · AI Meeting Assistants</title>   <script src="https://cdn.tailwindcss.com"></script>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 9
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 10
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/competitive-teardown/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Competitive Teardown · AI Meeting Assistants</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Competitive Teardown · AI Meeting Assistants</title>   <script src="https://cdn.tailwindcss.com"></script>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 9
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 10
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/data-report/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>数据周报 · 2025 年 5 月</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>数据周报 · 2025 年 5 月</title> <script src="https://cdn.tailwindcss.com"></script> <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/dating-web/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" />   <title>mutuals · your dating life, measured by the company you keep</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 6
      <title>mutuals · your dating life, measured by the company you keep</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Serif+Text:ital@0;1&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/deck-blueprint/example.html

    • Network accessline 6
      <title>Knowledge Arch Blueprint</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 7
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 15
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
    • Network accessline 312
      <div class="kb-kicker">System Diagram</div>     <h1 class="kb-h1" style="font-size:44px">反馈回路全貌</h1>     <svg viewBox="0 0 1200 520" style="width:100%;max-width:1200px;margin-top:20px" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 313
      <h1 class="kb-h1" style="font-size:44px">反馈回路全貌</h1>     <svg viewBox="0 0 1200 520" style="width:100%;max-width:1200px;margin-top:20px" xmlns="http://www.w3.org/2000/svg">       <defs>
    • Network accessline 314
      <svg viewBox="0 0 1200 520" style="width:100%;max-width:1200px;margin-top:20px" xmlns="http://www.w3.org/2000/svg">

    next/src/lib/templates/skills/deck-course-module/example.html

    • Network accessline 5
      <title>Module 04 · Recursion · CS101</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 6
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 7
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');

    next/src/lib/templates/skills/deck-dir-key-nav/example.html

    • Network accessline 6
      <title>Dir-Key Nav Minimal</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 7
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 15
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');

    next/src/lib/templates/skills/deck-graphify-dark/example.html

    • Network accessline 6
      <title>Graphify Dark Graph</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 7
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 15
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
    • Network accessline 238
      <div class="gd-ambient"><div class="gd-orb gd-orb-1"></div><div class="gd-orb gd-orb-2"></div><div class="gd-orb gd-orb-3"></div></div>     <!-- live force-directed graph bg -->     <svg viewBox="0 0 1600 900" style="position:absolute;inset
    • Network accessline 239
      <!-- live force-directed graph bg -->     <svg viewBox="0 0 1600 900" style="position:absolute;inset:0;width:100%;height:100%;opacity:.38;z-index:1" xmlns="http://www.w3.org/2000/svg">       <g stroke="#7eb8da" stroke-width="1" stroke-opaci
    • Network accessline 240
      <svg viewBox="0 0 1600 900" style="position:absolute;inset:0;width:100%;height:100%;opacity:.38;z-index:1" xmlns="http://www.w3.org/2000/svg">

    next/src/lib/templates/skills/deck-guizang-editorial/SKILL.md

    • Network accessline 16
      example_tagline: "墨水经典调色板 + 衬线 display" example_desc: "L02 Act Divider 章节封页 + L03 Big Numbers Grid 数据格, 纸感印刷" example_source_url: "https://github.com/op7418/guizang-ppt-skill"
    • Network accessline 17
      example_desc: "L02 Act Divider 章节封页 + L03 Big Numbers Grid 数据格, 纸感印刷" example_source_url: "https://github.com/op7418/guizang-ppt-skill" example_source_label: "op7418/guizang-ppt-skill"
    • Network accessline 18
      example_source_url: "https://github.com/op7418/guizang-ppt-skill"

    next/src/lib/templates/skills/deck-guizang-editorial/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>贵赞编辑墨水 · 章节封页</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>贵赞编辑墨水 · 章节封页</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,700;1,400&family=Inter:wght@400;500;600&family=Noto+Serif+SC:wght
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,700;1,400&family=Inter:wght@400;500;600&family=Noto+Serif+SC:wght@400;500;700&family=Noto+Sans+SC:wght@400;500&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/deck-hermes-cyber/example.html

    • Network accessline 6
      <title>Hermes Cyber Terminal</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 7
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 15
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
    • Network accessline 316
      <h2 class="hc-h2">72 小时对比</h2>     <p class="hc-lede">同一组 48 个 GitHub issue，两个 agent 各跑一遍</p>     <svg viewBox="0 0 1000 380" style="width:100%;max-width:1040px;margin-top:24px" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 317
      <p class="hc-lede">同一组 48 个 GitHub issue，两个 agent 各跑一遍</p>     <svg viewBox="0 0 1000 380" style="width:100%;max-width:1040px;margin-top:24px" xmlns="http://www.w3.org/2000/svg">       <g font-family="JetBrains Mono, monospace" font-size="1
    • Network accessline 318
      <svg viewBox="0 0 1000 380" style="width:100%;max-width:1040px;margin-top:24px" xmlns="http://www.w3.org/2000/svg">

    next/src/lib/templates/skills/deck-ljg-present/SKILL.md

    • Network accessline 14
      example_tagline: "Red 宣言 · 错位大字 · 左对齐" example_desc: "8 页 outline-faithful 演讲, 一级标题封面 + 列表错位 + 分隔符休止页 + 收束反问, 全程不重写原文" example_source_url: "https://github.com/lijigang/ljg-skills/tree/md/skills/ljg-present"
    • Network accessline 15
      example_desc: "8 页 outline-faithful 演讲, 一级标题封面 + 列表错位 + 分隔符休止页 + 收束反问, 全程不重写原文" example_source_url: "https://github.com/lijigang/ljg-skills/tree/md/skills/ljg-present" example_source_label: "lijigang/ljg-skills · ljg-present"
    • Network accessline 16
      example_source_url: "https://github.com/lijigang/ljg-skills/tree/md/skills/ljg-present"
    • Network accessline 287
      【致谢】 本 skill 改编自 [lijigang/ljg-skills · ljg-present](https://github.com/lijigang/ljg-skills/tree/md/skills/ljg-present)（v3.0.0）。原版输出多主题包含 cyber-hacker 模式与 PNG 投影; html-anything 版只保留 3 主题 + 单文件 HTML 输出。审美灵感继续指向 Felipe Franco / BIG STUDIOS 的
    • Network accessline 288
      本 skill 改编自 [lijigang/ljg-skills · ljg-present](https://github.com/lijigang/ljg-skills/tree/md/skills/ljg-present)（v3.0.0）。原版输出多主题包含 cyber-hacker 模式与 PNG 投影; html-anything 版只保留 3 主题 + 单文件 HTML 输出。审美灵感继续指向 Felipe Franco / BIG STUDIOS 的 manif

    next/src/lib/templates/skills/deck-magazine-web/example.html

    • Network accessline 6
      <title>Open Design · kami deck — Vol. 01 / Issue Nº 26</title> <meta name='description' content='Open Design as a kami slide deck. Warm parchment with ink-blue cover and chapter slides, serif at one weight, no italic.' /> <link rel='preconn
    • Network accessline 7
      <meta name='description' content='Open Design as a kami slide deck. Warm parchment with ink-blue cover and chapter slides, serif at one weight, no italic.' /> <link rel='preconnect' href='https://fonts.googleapis.com' /> <link rel='preconne
    • Network accessline 8
      <link rel='preconnect' href='https://fonts.googleapis.com' />
    • Network accessline 9
      <link rel='preconnect' href='https://fonts.gstatic.com' crossorigin />
    • Network accessline 10
      <link href='https://fonts.googleapis.com/css2?family=Source+Serif+4:wght@400;500&family=Source+Sans+3:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap' rel='stylesheet' />
    • Network accessline 899
      </p>       <div class='actions'>         <a class='btn btn-primary' href='https://github.com/nexu-io/open-design'>Star on GitHub</a>
    • Network accessline 900
      <div class='actions'>         <a class='btn btn-primary' href='https://github.com/nexu-io/open-design'>Star on GitHub</a>         <a class='btn btn-ghost' href='https://github.com/nexu-io/open-design/issues'>Open an issue</a>
    • Network accessline 901
      <a class='btn btn-primary' href='https://github.com/nexu-io/open-design'>Star on GitHub</a>
    • Network accessline 902
      <a class='btn btn-ghost' href='https://github.com/nexu-io/open-design/issues'>Open an issue</a>

    next/src/lib/templates/skills/deck-obsidian-claude/example.html

    • Network accessline 6
      <title>Obsidian × Claude Gradient</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 7
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 15
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
    • Network accessline 316
      <span class="cc">"env"</span>: {         <span class="cc">"OBSIDIAN_API_KEY"</span>: <span class="cs">"xxxxxxxxxxxxxxxx"</span>,         <span class="cc">"OBSIDIAN_HOST"</span>: <span class="cs">"http://127.0.0.1:27123"</span>
    • Network accessline 317
      [Credential-related source omitted]
    • Access to secretsline 317
      [Credential-related source omitted]
    • Network accessline 318
      <span class="cc">"OBSIDIAN_HOST"</span>: <span class="cs">"http://127.0.0.1:27123"</span>

    next/src/lib/templates/skills/deck-open-slide-canvas/SKILL.md

    • Network accessline 16
      example_tagline: "锁死 1920×1080 + 自由组合" example_desc: "Sea Indigo 调色 + 一页大字 question + 角标" example_source_url: "https://github.com/1weiho/open-slide"
    • Network accessline 17
      example_desc: "Sea Indigo 调色 + 一页大字 question + 角标" example_source_url: "https://github.com/1weiho/open-slide" example_source_label: "1weiho/open-slide"
    • Network accessline 18
      example_source_url: "https://github.com/1weiho/open-slide"

    next/src/lib/templates/skills/deck-open-slide-canvas/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Open-Slide Canvas · 一句问题</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Open-Slide Canvas · 一句问题</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800;900&family=Inter:wght@400;500&family=Noto+Sans+SC:wght@400
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800;900&family=Inter:wght@400;500&family=Noto+Sans+SC:wght@400;500;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/deck-pitch/example.html

    • Network accessline 5
      <title>Lumen · Pitch Deck</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 6
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 7
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');

    next/src/lib/templates/skills/deck-presenter-mode/example.html

    • Network accessline 6
      <title>演讲者模式示例 · Presenter Mode Deck</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 7
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 15
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
    • Network accessline 689
      <div class="code-block mt-m"> <span class="comment"># 安装 html-ppt skill</span> <span class="cmd">npx</span> skills add <span class="flag">https://github.com/lewislulu/html-ppt-skill</span>
    • Network accessline 691
      <span class="cmd">npx</span> skills add <span class="flag">https://github.com/lewislulu/html-ppt-skill</span>

    next/src/lib/templates/skills/deck-product-launch/example.html

    • Network accessline 5
      <title>Halo v2 · Launch</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 6
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 7
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');

    next/src/lib/templates/skills/deck-replit/SKILL.md

    • Network accessline 14
      example_tagline: "Replit Slides 八套主题之一" example_desc: "World Mint 主题封页 + agenda 双页, sans + neon mint accent" example_source_url: "https://replit.com/slides"
    • Network accessline 15
      example_desc: "World Mint 主题封页 + agenda 双页, sans + neon mint accent" example_source_url: "https://replit.com/slides" example_source_label: "Replit Slides"
    • Network accessline 16
      example_source_url: "https://replit.com/slides"

    next/src/lib/templates/skills/deck-replit/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Replit Slides · World Mint</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Replit Slides · World Mint</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@500;700;800;900&family=Inter:wght@400;500&family=JetBrains+Mono&display=swap
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@500;700;800;900&family=Inter:wght@400;500&family=JetBrains+Mono&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/deck-safety-alert/example.html

    • Network accessline 6
      <title>Testing Safety Alert</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 7
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 15
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
    • Network accessline 320
      <h2 class="ts-h2">我们 Q1 的 <span class="red">12 起 AI 事故</span></h2>     <p class="ts-sub">幸好全部捕获在 staging。但每一起都能上生产。</p>     <svg viewBox="0 0 1040 360" style="width:100%;max-width:1040px;margin-top:18px" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 321
      <p class="ts-sub">幸好全部捕获在 staging。但每一起都能上生产。</p>     <svg viewBox="0 0 1040 360" style="width:100%;max-width:1040px;margin-top:18px" xmlns="http://www.w3.org/2000/svg">       <g font-family="Inter,sans-serif" font-size="14" fill="#4a4955">
    • Network accessline 322
      <svg viewBox="0 0 1040 360" style="width:100%;max-width:1040px;margin-top:18px" xmlns="http://www.w3.org/2000/svg">

    next/src/lib/templates/skills/deck-swiss-international/SKILL.md

    • Network accessline 16
      example_tagline: "Klein Blue IKB + 16 列网格" example_desc: "S01 Cover + S06 KPI Tower 两页预览, IKB 全屏标题 + 4 柱状 KPI" example_source_url: "https://github.com/op7418/guizang-ppt-skill"
    • Network accessline 17
      example_desc: "S01 Cover + S06 KPI Tower 两页预览, IKB 全屏标题 + 4 柱状 KPI" example_source_url: "https://github.com/op7418/guizang-ppt-skill" example_source_label: "op7418/guizang-ppt-skill"
    • Network accessline 18
      example_source_url: "https://github.com/op7418/guizang-ppt-skill"

    next/src/lib/templates/skills/deck-swiss-international/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Swiss International · Open Design 2026</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Swiss International · Open Design 2026</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600&family=Not
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600&family=Noto+Sans+SC:wght@400;500;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/deck-tech-sharing/example.html

    • Network accessline 5
      <title>Rust 异步运行时内部机制 · Tech Sharing</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 6
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 7
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');

    next/src/lib/templates/skills/deck-xhs-pastel/example.html

    • Network accessline 6
      <title>XHS Pastel Card</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 7
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 15
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');

    next/src/lib/templates/skills/deck-xhs-post/example.html

    • Network accessline 5
      <title>每天只睡 6h 还精神？· 小红书图文</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 6
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 7
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');

    next/src/lib/templates/skills/deck-xhs-white/example.html

    • Network accessline 6
      <title>白底杂志风 · XHS Editorial</title> <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 7
      <style>/* html-ppt :: shared webfonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;50
    • Network accessline 8
      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500;600;700;800;900&display=swap');
    • Network accessline 9
      @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@200;300;400;500;600;700;900&display=swap');
    • Network accessline 10
      @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@300;400;600;700&display=swap');
    • Network accessline 11
      @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&display=swap');
    • Network accessline 12
      @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,800;1,400&display=swap');
    • Network accessline 13
      @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    • Network accessline 14
      @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300;400;500;700&display=swap');
    • Network accessline 15
      @import url('https://fonts.googleapis.com/css2?family=Archivo+Black&display=swap');
    • Network accessline 337
      </div>     <h2 class="xw-title-md">越来越 <span class="xw-focus-pink">便宜</span>，越来越 <span class="xw-focus-green">贵</span></h2>     <svg viewBox="0 0 960 380" style="width:100%;max-width:1000px;margin-top:30px" xmlns="http://www.w3.org/2000/svg
    • Network accessline 338
      <h2 class="xw-title-md">越来越 <span class="xw-focus-pink">便宜</span>，越来越 <span class="xw-focus-green">贵</span></h2>     <svg viewBox="0 0 960 380" style="width:100%;max-width:1000px;margin-top:30px" xmlns="http://www.w3.org/2000/svg">       <g
    • Network accessline 339
      <svg viewBox="0 0 960 380" style="width:100%;max-width:1000px;margin-top:30px" xmlns="http://www.w3.org/2000/svg">

    next/src/lib/templates/skills/digital-eguide/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" />   <title>The Creator's Style &amp; Format Guide — Auny</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 6
      <title>The Creator's Style &amp; Format Guide — Auny</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,700;1,500;1,700&family=DM+Serif+Text:ital@0;1&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/doc-kami-parchment/SKILL.md

    • Network accessline 16
      example_tagline: "暖羊皮纸 + 墨蓝单色 + 单一衬线" example_desc: "一页 Open Design Studio Issue №26 编辑级 one-pager" example_source_url: "https://github.com/tw93/kami"
    • Network accessline 17
      example_desc: "一页 Open Design Studio Issue №26 编辑级 one-pager" example_source_url: "https://github.com/tw93/kami" example_source_label: "tw93/kami"
    • Network accessline 18
      example_source_url: "https://github.com/tw93/kami"

    next/src/lib/templates/skills/doc-kami-parchment/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Kami Parchment · Open Design Studio №26</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Kami Parchment · Open Design Studio №26</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Source+Serif+Pro:ital,wght@0,400;0,500;0,600;1,400&family=Noto+Serif+SC:wght@400
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Source+Serif+Pro:ital,wght@0,400;0,500;0,600;1,400&family=Noto+Serif+SC:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/doc-kami-parchment/example.md

    • Network accessline 26
      We release one document per fortnight. Subscribe at [opendesign.studio](https://opendesign.studio).

    next/src/lib/templates/skills/docs-page/example.html

    • Network accessline 82
      # Linux · curl curl -fsSL https://get.filebase.dev | sh</code></pre>
    • Dangerous shell operationline 83
      curl -fsSL https://get.filebase.dev | sh</code></pre>
    • Network accessline 83
      curl -fsSL https://get.filebase.dev | sh</code></pre>

    next/src/lib/templates/skills/exec-briefing-memo/assets/board-memo.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Executive Briefing Memo · Enterprise Plan</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Executive Briefing Memo · Enterprise Plan</title>   <script src="https://cdn.tailwindcss.com"></script>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 9
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 10
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/exec-briefing-memo/assets/board-paper.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Executive Briefing Memo · Board Paper</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Executive Briefing Memo · Board Paper</title>   <script src="https://cdn.tailwindcss.com"></script>   <link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:wght@500;700;800&family=Inter:wght@400;600;800&display=swap" re
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:wght@500;700;800&family=Inter:wght@400;600;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/exec-briefing-memo/assets/decision-command.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Executive Briefing Memo · Decision Command</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Executive Briefing Memo · Decision Command</title>   <script src="https://cdn.tailwindcss.com"></script>   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap" rel="stylesheet">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/exec-briefing-memo/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Executive Briefing Memo · Enterprise Plan</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Executive Briefing Memo · Enterprise Plan</title>   <script src="https://cdn.tailwindcss.com"></script>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 9
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 10
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/experiment-readout/assets/growth-console.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Experiment Readout · Growth Console</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Experiment Readout · Growth Console</title>   <script src="https://cdn.tailwindcss.com"></script>   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap" rel="stylesheet">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/experiment-readout/assets/lab-notebook.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Experiment Readout · Lab Notebook</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Experiment Readout · Lab Notebook</title>   <script src="https://cdn.tailwindcss.com"></script>   <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600;700&family=Inter:wght@400;600;800&display=swap" rel="st
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;600;700&family=Inter:wght@400;600;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/experiment-readout/assets/product-readout.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Experiment Readout · Onboarding Checklist</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Experiment Readout · Onboarding Checklist</title>   <script src="https://cdn.tailwindcss.com"></script>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 9
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 10
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/experiment-readout/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />   <title>Experiment Readout · Onboarding Checklist</title>   <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Experiment Readout · Onboarding Checklist</title>   <script src="https://cdn.tailwindcss.com"></script>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 9
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 10
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;700;800&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/frame-data-chart-nyt/SKILL.md

    • Network accessline 15
      example_tagline: "编辑级图表 + 错峰揭示" example_desc: "8 年周活跃用户折线 + NYT red accent + 注释 mono" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 16
      example_desc: "8 年周活跃用户折线 + NYT red accent + 注释 mono" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · data-chart"
    • Network accessline 17
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/frame-data-chart-nyt/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>NYT Chart · AI Agent MAU 2018–2026</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>NYT Chart · AI Agent MAU 2018–2026</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Source+Serif+Pro:ital,wght@0,400;0,600;1,400&family=IBM+Plex+Sans:wght@400;500;600&fa
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Source+Serif+Pro:ital,wght@0,400;0,600;1,400&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500&family=Noto+Sans+SC:wght@400;500;600&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/frame-flowchart-sticky/SKILL.md

    • Network accessline 15
      example_tagline: "SVG 曲线 + 4 色便利贴" example_desc: "6 节点 onboarding 流程, 手写体 + 白板纸底" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 16
      example_desc: "6 节点 onboarding 流程, 手写体 + 白板纸底" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · flowchart"
    • Network accessline 17
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/frame-flowchart-sticky/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Sticky Flowchart · HTML Anything Onboarding</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Sticky Flowchart · HTML Anything Onboarding</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@500;600;700&family=Patrick+Hand&family=Inter:wght@400;500;600&fa
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@500;600;700&family=Patrick+Hand&family=Inter:wght@400;500;600&family=IBM+Plex+Mono&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/frame-glitch-title/SKILL.md

    • Network accessline 16
      example_tagline: "cyan / magenta 像散 + CRT 扫描线" example_desc: "巨大标题 + 数据腐败伪影 + 角落 ASCII 噪点 chunks" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 17
      example_desc: "巨大标题 + 数据腐败伪影 + 角落 ASCII 噪点 chunks" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · glitch"
    • Network accessline 18
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/frame-glitch-title/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Glitch Title · SIGNAL_LOST</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Glitch Title · SIGNAL_LOST</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700;800&family=JetBrains+Mono:wght@400;700&display=swap" rel="styleshe
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700;800&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet" />
    • Network accessline 23
      /* grain */   .grain { position:absolute; inset:0; opacity:0.1; mix-blend-mode:overlay; z-index:4; pointer-events:none;     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfi
    • Network accessline 24
      .grain { position:absolute; inset:0; opacity:0.1; mix-blend-mode:overlay; z-index:4; pointer-events:none;     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E
    • Network accessline 25
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='ur

    next/src/lib/templates/skills/frame-light-leak-cinema/SKILL.md

    • Network accessline 15
      example_tagline: "暖橙漏光 + 35mm 颗粒" example_desc: "2.39:1 letterbox + 衬线斜体大字 + 胶片齿孔" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 16
      example_desc: "2.39:1 letterbox + 衬线斜体大字 + 胶片齿孔" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · light-leak"
    • Network accessline 17
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/frame-light-leak-cinema/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Light Leak Cinema · REEL 03</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Light Leak Cinema · REEL 03</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=Source+Serif+Pro:ital,wght@0,400;1,400;
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=Source+Serif+Pro:ital,wght@0,400;1,400;1,500&family=IBM+Plex+Mono:wght@400;500&family=Noto+Serif+SC:wght@400;500&display=swap" rel="st
    • Network accessline 23
      }   .grain { position:absolute; inset:0; opacity:0.14; mix-blend-mode:overlay; pointer-events:none;     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeT
    • Network accessline 24
      .grain { position:absolute; inset:0; opacity:0.14; mix-blend-mode:overlay; pointer-events:none;     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbu
    • Network accessline 25
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='u

    next/src/lib/templates/skills/frame-liquid-bg-hero/SKILL.md

    • Network accessline 15
      example_tagline: "Aurora Violet 流体" example_desc: "多层 radial-gradient 呼吸背景 + difference 文字" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 16
      example_desc: "多层 radial-gradient 呼吸背景 + difference 文字" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · vfx-liquid-background"
    • Network accessline 17
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/frame-liquid-bg-hero/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Liquid Hero · Aurora Violet</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Liquid Hero · Aurora Violet</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;700;800;900&family=Noto+Sans+SC:wght@400;700;900&family=Source+Serif+Pr
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;700;800;900&family=Noto+Sans+SC:wght@400;700;900&family=Source+Serif+Pro:ital,wght@1,400;1,600&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/frame-logo-outro/SKILL.md

    • Network accessline 16
      example_tagline: "Midnight Indigo + glow bloom" example_desc: "Logo 装配 + 品牌名 + tagline + CTA, 视频片尾用" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 17
      example_desc: "Logo 装配 + 品牌名 + tagline + CTA, 视频片尾用" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · logo-outro"
    • Network accessline 18
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/frame-logo-outro/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Logo Outro · HTML Anything</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Logo Outro · HTML Anything</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;700;800;900&family=Inter:wght@400;500&family=Noto+Sans+SC:wght@400;5
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;700;800;900&family=Inter:wght@400;500&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/frame-macos-notification/SKILL.md

    • Network accessline 15
      example_tagline: "Big Sur 磨砂玻璃 banner" example_desc: "App icon + 标题 + 双行正文, 视频角落叠加用" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 16
      example_desc: "App icon + 标题 + 双行正文, 视频角落叠加用" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · macos-notification"
    • Network accessline 17
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/frame-macos-notification/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>macOS Notification · 转换完成</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>macOS Notification · 转换完成</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet"
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/gamified-app/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" />   <title>Level — daily quests for becoming a better human</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 6
      <title>Level — daily quests for becoming a better human</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/info-funnel/SKILL.md

    • Network accessline 14
      example_tagline: "5 阶 · 米白 + Klein Blue · 大数字 + 转化率" example_desc: "访客 → 注册 → 试用 → 付费 → 留存 5 步漏斗, 左侧绝对数右侧阶段转化率, 底部累计漏出洞察" example_source_url: "https://github.com/JimLiu/baoyu-skills#baoyu-infographic"
    • Network accessline 15
      example_desc: "访客 → 注册 → 试用 → 付费 → 留存 5 步漏斗, 左侧绝对数右侧阶段转化率, 底部累计漏出洞察" example_source_url: "https://github.com/JimLiu/baoyu-skills#baoyu-infographic" example_source_label: "baoyu-skills · infographic/funnel"
    • Network accessline 16
      example_source_url: "https://github.com/JimLiu/baoyu-skills#baoyu-infographic"
    • Network accessline 152
      【致谢】 本 skill 设计参考 [baoyu-skills · baoyu-infographic](https://github.com/JimLiu/baoyu-skills) 的 funnel layout 规范, 视觉补完 + HTML 实现由 html-anything 独立编写。
    • Network accessline 153
      本 skill 设计参考 [baoyu-skills · baoyu-infographic](https://github.com/JimLiu/baoyu-skills) 的 funnel layout 规范, 视觉补完 + HTML 实现由 html-anything 独立编写。

    next/src/lib/templates/skills/mockup-device-3d/SKILL.md

    • Network accessline 15
      example_tagline: "HTML-in-Canvas 设备秀" example_desc: "iPhone 屏幕 + MacBook 屏幕都嵌入真实 UI 内容, 玻璃镜头折射" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 16
      example_desc: "iPhone 屏幕 + MacBook 屏幕都嵌入真实 UI 内容, 玻璃镜头折射" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · vfx-iphone-device"
    • Network accessline 17
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/mockup-device-3d/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Device 3D Showcase · HTML-in-Canvas</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Device 3D Showcase · HTML-in-Canvas</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;600;700;800&family=Inter:wght@400;500;600&family=Noto+Sans+SC:w
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;600;700;800&family=Inter:wght@400;500;600&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/poster-hero/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>HTML Anything 0.1 海报</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>HTML Anything 0.1 海报</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@600;700;800;900&family=Noto+Sans+SC:wght@500;700;900&family=JetBrains+Mono:wght@50
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@600;700;800;900&family=Noto+Sans+SC:wght@500;700;900&family=JetBrains+Mono:wght@500&display=swap" rel="stylesheet">
    • Network accessline 58
      <div style="display:flex; align-items:center; gap:24px; padding-top:24px; border-top:1px solid rgba(255,255,255,0.18)">     <div class="qr">       <svg viewBox="0 0 33 33" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 59
      <div class="qr">       <svg viewBox="0 0 33 33" xmlns="http://www.w3.org/2000/svg">         <rect width="33" height="33" fill="#fff"/>
    • Network accessline 60
      <svg viewBox="0 0 33 33" xmlns="http://www.w3.org/2000/svg">

    next/src/lib/templates/skills/ppt-keynote/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>HTML Anything · 产品介绍</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>HTML Anything · 产品介绍</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;600;700&family=JetBrains+Mono
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
    • Network accessline 109
      <div>         <div style="font-family:'JetBrains Mono',monospace; font-size:16px; opacity:0.85">$ pnpm dev</div>         <div style="opacity:0.85; margin-top:6px">→ http://localhost:3000 → ⌘+Enter</div>
    • Network accessline 110
      <div style="font-family:'JetBrains Mono',monospace; font-size:16px; opacity:0.85">$ pnpm dev</div>         <div style="opacity:0.85; margin-top:6px">→ http://localhost:3000 → ⌘+Enter</div>       </div>
    • Network accessline 111
      <div style="opacity:0.85; margin-top:6px">→ http://localhost:3000 → ⌘+Enter</div>

    next/src/lib/templates/skills/prototype-web/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" /> <title>Inkstack — 让 AI 替你写运营文档</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 6
      <title>Inkstack — 让 AI 替你写运营文档</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;600;700&display=swap" rel=
    • Network accessline 7
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700;800&family=Noto+Sans+SC:wght@400;500;600;700&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/resume-modern/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>林清禾 · 简历</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>林清禾 · 简历</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Noto+Sans+SC:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Noto+Sans+SC:wght@300;400;500;600;700&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/social-carousel/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" />   <title>Three posts. One beat. — social carousel</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 6
      <title>Three posts. One beat. — social carousel</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/social-media-dashboard/example.html

    • Network accessline 6
      <meta name="viewport" content="width=device-width, initial-scale=1.0">   <title>Open Design · Social Analytics</title>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 7
      <title>Open Design · Social Analytics</title>   <link rel="preconnect" href="https://fonts.googleapis.com">   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 9
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 10
      <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
    • Network accessline 1234
      // Real GitHub contributors — only verified avatar IDs to avoid 404s     const githubContributors = [       { login: "pftom", avatar: "https://avatars.githubusercontent.com/u/26423749?v=4", contributions: 26 },
    • Network accessline 1235
      const githubContributors = [       { login: "pftom", avatar: "https://avatars.githubusercontent.com/u/26423749?v=4", contributions: 26 },       { login: "lefarcen", avatar: "https://avatars.githubusercontent.com/u/20859779?v=4", contributio
    • Network accessline 1236
      { login: "pftom", avatar: "https://avatars.githubusercontent.com/u/26423749?v=4", contributions: 26 },
    • Network accessline 1237
      { login: "lefarcen", avatar: "https://avatars.githubusercontent.com/u/20859779?v=4", contributions: 18 },
    • Network accessline 1238
      { login: "Sid-Qin", avatar: "https://avatars.githubusercontent.com/u/201593046?v=4", contributions: 17 },
    • Network accessline 1239
      { login: "nettee", avatar: "https://avatars.githubusercontent.com/u/3953668?v=4", contributions: 10 },
    • Network accessline 1240
      { login: "alchemistklk", avatar: "https://avatars.githubusercontent.com/u/56862773?v=4", contributions: 8 }
    • Network accessline 1329
      for (let i = 0; i <= 5; i++) {         const y = i * 56;         const line = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    • Network accessline 1330
      const y = i * 56;         const line = document.createElementNS('http://www.w3.org/2000/svg', 'line');         line.setAttribute('x1', '0');
    • Network accessline 1331
      const line = document.createElementNS('http://www.w3.org/2000/svg', 'line');
    • Network accessline 1342
      // Area fill       const areaPoints = chartBaseData.map(d => `${d.x},${d.y}`).join(' ');       const area = document.createElementNS('http://www.w3.org/2000/svg', 'polygon');
    • Network accessline 1343
      const areaPoints = chartBaseData.map(d => `${d.x},${d.y}`).join(' ');       const area = document.createElementNS('http://www.w3.org/2000/svg', 'polygon');       area.setAttribute('points', `0,280 ${areaPoints} 600,280`);
    • Network accessline 1344
      const area = document.createElementNS('http://www.w3.org/2000/svg', 'polygon');
    • Network accessline 1349
      // Line       const linePoints = chartBaseData.map(d => `${d.x},${d.y}`).join(' ');       const line = document.createElementNS('http://www.w3.org/2000/svg', 'polyline');
    • Network accessline 1350
      const linePoints = chartBaseData.map(d => `${d.x},${d.y}`).join(' ');       const line = document.createElementNS('http://www.w3.org/2000/svg', 'polyline');       line.setAttribute('points', linePoints);
    • Network accessline 1351
      const line = document.createElementNS('http://www.w3.org/2000/svg', 'polyline');
    • Network accessline 1361
      // otherwise place it below so the text never collides with the curve.       data.chartAnnotations.forEach(ann => {         const circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
    • Network accessline 1362
      data.chartAnnotations.forEach(ann => {         const circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');         circle.setAttribute('cx', ann.x);
    • Network accessline 1363
      const circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
    • Network accessline 1379
      // Soft pill background behind the text so it stays legible across the         // gold gradient + chart line, without using a heavy rect.         const text = document.createElementNS('http://www.w3.org/2000/svg', 'text');
    • Network accessline 1380
      // gold gradient + chart line, without using a heavy rect.         const text = document.createElementNS('http://www.w3.org/2000/svg', 'text');         text.setAttribute('x', ann.x);
    • Network accessline 1381
      const text = document.createElementNS('http://www.w3.org/2000/svg', 'text');

    next/src/lib/templates/skills/social-reddit-card/SKILL.md

    • Network accessline 15
      example_tagline: "Reddit dark mode + vote rail" example_desc: "一条 AITA 风格故事 + 12.3k upvotes + 1.2k comments" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 16
      example_desc: "一条 AITA 风格故事 + 12.3k upvotes + 1.2k comments" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · reddit-post"
    • Network accessline 17
      example_source_url: "https://hyperframes.heygen.com/catalog"
    • Possible obfuscationline 36
      - 底部 action row: 💬 `1.2k Comments` · 🏆 Awards · ⤴<U+FE0F> Share · ⋯ icon。

    next/src/lib/templates/skills/social-reddit-card/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Reddit Post · r/programming</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Reddit Post · r/programming</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="s
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/social-spotify-card/SKILL.md

    • Network accessline 15
      example_tagline: "Spotify 经典 dark 卡" example_desc: "Lo-Fi Beats · Chillhop 进度条 1:24 / 3:42 + 控制行" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 16
      example_desc: "Lo-Fi Beats · Chillhop 进度条 1:24 / 3:42 + 控制行" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · spotify-card"
    • Network accessline 17
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/social-spotify-card/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Spotify Now Playing · Lo-Fi</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Spotify Now Playing · Lo-Fi</title> <script src="https://cdn.tailwindcss.com"></script> <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 8
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/social-x-post-card/SKILL.md

    • Network accessline 15
      example_tagline: "X dark mode + 互动数据" example_desc: "一条金句推文 + 12.3K likes / 1.2K reposts + 蓝勾" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 16
      example_desc: "一条金句推文 + 12.3K likes / 1.2K reposts + 蓝勾" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · x-post"
    • Network accessline 17
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/social-x-post-card/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>X Post Card · Markdown is Dead</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>X Post Card · Markdown is Dead</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700&family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet" />

    next/src/lib/templates/skills/sprite-animation/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" />   <title>Nintendo, 1889 — sprite animation</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 6
      <title>Nintendo, 1889 — sprite animation</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=IBM+Plex+Mono:wght@400;500&family=Noto+Serif+JP:wght@500;700&family=Press+Start+2P&display=swap" rel="stylesheet" />
    • Network accessline 211
      <div class="sprite-card">         <!-- Hanafuda card sprite — pixel-art flower -->         <svg width="120" height="160" viewBox="0 0 24 32" xmlns="http://www.w3.org/2000/svg" aria-label="Hanafuda card">
    • Network accessline 212
      <!-- Hanafuda card sprite — pixel-art flower -->         <svg width="120" height="160" viewBox="0 0 24 32" xmlns="http://www.w3.org/2000/svg" aria-label="Hanafuda card">           <!-- background -->
    • Network accessline 213
      <svg width="120" height="160" viewBox="0 0 24 32" xmlns="http://www.w3.org/2000/svg" aria-label="Hanafuda card">

    next/src/lib/templates/skills/vfx-text-cursor/SKILL.md

    • Network accessline 16
      example_tagline: "逐字揭示 + chromatic 拖光" example_desc: "光标打字 hot pink + cyan 像散, 视频开场用" example_source_url: "https://hyperframes.heygen.com/catalog"
    • Network accessline 17
      example_desc: "光标打字 hot pink + cyan 像散, 视频开场用" example_source_url: "https://hyperframes.heygen.com/catalog" example_source_label: "hyperframes · vfx-text-cursor"
    • Network accessline 18
      example_source_url: "https://hyperframes.heygen.com/catalog"

    next/src/lib/templates/skills/vfx-text-cursor/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>VFX Text Cursor · Opening</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>VFX Text Cursor · Opening</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;700;800;900&family=Noto+Sans+SC:wght@400;700;900&family=JetBrains+Mono&di
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;700;800;900&family=Noto+Sans+SC:wght@400;700;900&family=JetBrains+Mono&display=swap" rel="stylesheet" />
    • Network accessline 10
      .vignette { position:absolute; inset:0; background: radial-gradient(circle at center, transparent 50%, rgba(0,0,0,0.8) 100%); z-index:1; }   .grain { position:absolute; inset:0; opacity:0.06; mix-blend-mode:overlay; pointer-events:none; z-i
    • Network accessline 11
      .grain { position:absolute; inset:0; opacity:0.06; mix-blend-mode:overlay; pointer-events:none; z-index:2;     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3
    • Network accessline 12
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='ur

    next/src/lib/templates/skills/video-hyperframes/SKILL.md

    • Network accessline 15
      example_tagline: "8 帧自动播放, 含进度条 + 元数据" example_desc: "电影感动画脚本, 可直接喂给 Remotion 做成 mp4" example_source_url: "https://github.com/heygen-com/hyperframes"
    • Network accessline 16
      example_desc: "电影感动画脚本, 可直接喂给 Remotion 做成 mp4" example_source_url: "https://github.com/heygen-com/hyperframes" example_source_label: "heygen-com/hyperframes"
    • Network accessline 17
      example_source_url: "https://github.com/heygen-com/hyperframes"

    next/src/lib/templates/skills/video-hyperframes/example.html

    • Network accessline 4
      <meta charset="UTF-8" /> <title>Hyperframes · AI workflow 三件套</title> <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 5
      <title>Hyperframes · AI workflow 三件套</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@600;800;900&family=Noto+Sans+SC:wght@600;700;900&family=JetBrains+Mono:wg
    • Network accessline 6
      <script src="https://cdn.tailwindcss.com"></script>
    • Network accessline 7
      <link href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@600;800;900&family=Noto+Sans+SC:wght@600;700;900&family=JetBrains+Mono:wght@500&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/waitlist-page/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1.0">   <title>Meridian — Coming Soon</title>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 6
      <title>Meridian — Coming Soon</title>   <link rel="preconnect" href="https://fonts.googleapis.com">   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=Syne:wght@700;800&family=DM+Sans:wght@400;500;600&display=swap" rel="stylesheet">
    • Network accessline 284
      <div class="logo">     <div class="logo-container">       <svg class="logo-svg" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 285
      <div class="logo-container">       <svg class="logo-svg" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">         <circle cx="50" cy="50" r="48" fill="var(--deco-logo)"/>
    • Network accessline 286
      <svg class="logo-svg" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 311
      <svg class="coil-row" viewBox="0 0 1440 60" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 335
      <div class="grid-floor">       <svg class="grid-svg" viewBox="0 0 1280 400" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg">
    • Network accessline 336
      <svg class="grid-svg" viewBox="0 0 1280 400" preserveAspectRatio="none" xmlns="http://www.w3.org/2000/svg">

    next/src/lib/templates/skills/web-proto-brutalist/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" />   <title>FIELD UNIT 04 // INSTRUMENT FOR THE LEGIBLE WEB</title>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 6
      <title>FIELD UNIT 04 // INSTRUMENT FOR THE LEGIBLE WEB</title>   <link rel="preconnect" href="https://fonts.googleapis.com">   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=Archivo+Black&family=Archivo:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/web-proto-editorial/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" />   <title>Quartz — quiet workspace for technical writers</title>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 6
      <title>Quartz — quiet workspace for technical writers</title>   <link rel="preconnect" href="https://fonts.googleapis.com">   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter+Tight:wght@400;500;600&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/web-proto-soft/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" />   <title>Halcyon — calmer infrastructure for AI agents</title>   <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 6
      <title>Halcyon — calmer infrastructure for AI agents</title>   <link rel="preconnect" href="https://fonts.googleapis.com">   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com">
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">

    next/src/lib/templates/skills/wireframe-sketch/example.html

    • Network accessline 5
      <meta name="viewport" content="width=device-width, initial-scale=1" />   <title>Zentou AI Portal — Wireframe v0.1</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 6
      <title>Zentou AI Portal — Wireframe v0.1</title>   <link rel="preconnect" href="https://fonts.googleapis.com" />   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 7
      <link rel="preconnect" href="https://fonts.googleapis.com" />
    • Network accessline 8
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    • Network accessline 9
      <link href="https://fonts.googleapis.com/css2?family=Caveat:wght@500;700&family=Patrick+Hand&family=DM+Serif+Display&family=IBM+Plex+Mono:wght@400;500&display=swap" rel="stylesheet" />

    How the signals fit together

    Facts from a static read of the files at the pinned commit. They describe what the code does, not why.

    Some files could not be read; the facts below still hold.

    Signal confidence: 76 facts

    and 26 more

    Works with

    Agent compatibility, from the files in this repository
    AgentStatusEvidenceInstall to
    Claude CodeNativePath CLAUDE.md.claude/skills/<skill-name>/
    CodexNativeManifest AGENTS.md.agents/skills/<skill-name>/
    CursorCompatibleStandard SKILL.md next/src/lib/templates/skills/article-magazine/SKILL.md.cursor/skills/<skill-name>/
    Gemini CLICompatibleStandard SKILL.md next/src/lib/templates/skills/article-magazine/SKILL.md.gemini/skills/<skill-name>/
    GitHub CopilotCompatibleStandard SKILL.md next/src/lib/templates/skills/article-magazine/SKILL.md.github/skills/<skill-name>/
    OpenCodeCompatibleStandard SKILL.md next/src/lib/templates/skills/article-magazine/SKILL.md.opencode/skills/<skill-name>/
    • Native The repository ships a manifest, folder or frontmatter field for this agent.
    • Compatible A standard SKILL.md that this agent can read.
    • Unknown No evidence either way.

    Derived automatically from paths, manifests and frontmatter. Not tested on each agent.

    You might also use

    aiatelie/ai-atelie

    Local-first, open-source alternative to Anthropic's Claude Design. MIT-licensed, BYO agent CLI — Claude Code, Kimi, Codex, or any SDK-compatible model. Composable skills · three e…

    11GitHub stars

    Aryanutkarsh/SeeCode

    Create animated, explorable editorial diagrams in 45 types (architecture, flowchart, sequence, state, ER, DB schema, UML class, swimlane, timeline, gantt, journey, tree, org chart…

    889GitHub stars

    pixelab-ch/higgsfield-skills

    Model-aware Claude Agent Skills for AI image & video generation on Higgsfield — 15 creative skills with opt-in MCP generation. Reworked from beshuaxian/higgsfield-seedance2-jineng.

    12GitHub stars

    justskill-ai/justskill-design

    Design with your coding agent — A skill, not a product: no MCP server, no app to install, no account, no build step, no npm install.

    11GitHub stars

    coreyhaines31/marketingskills

    Marketing skills for Claude Code and AI agents. CRO, copywriting, SEO, analytics, and growth engineering.

    58.8kGitHub stars

    alchaincyf/huashu-design

    花叔Design——用HTML做高保真原型、幻灯片、动画、可视化与专家评审。任何新设计100%先出三个方向初稿给用户选（指定风格/品牌也不豁免），选定后才执行。触发词：做原型、PPT、幻灯片、动画、…

    28.9kGitHub stars

    Explore alternatives and comparisons

    Add this badge to your README

    It updates every night and links to this page.

    nexu-io/html-anything: #156 on hotskills, 9.4k stars

    [![nexu-io/html-anything on hotskills](https://hotskills.dev/badge/nexu-io-html-anything.svg)](https://hotskills.dev/skill/nexu-io-html-anything/)