Tools
Every Skill, MCP server, CLI and plugin in the directory. Filter by type, profession or tag, or search by keyword.
Profession: DevOps / SRE +3
Pick one or more: resources that suit any of them are listed.
Tags: html
Pick one or more: only resources carrying all of them are listed.
- html11
- presentations4
- data-visualization3
- ui-design3
- video-generation3
- diagrams2
- graphic-design2
- heygen2
- mermaid2
- technical-writing2
- video-editing2
- animation1
- anthropic1
- branding1
- design-files1
- ffmpeg1
- file-conversion1
- reveal-js1
- svg1
- teaching1
- typography1
There are more. Type to find them.
11 items

Archify
SkillTurns natural-language descriptions, Mermaid or a real code repo into interactive single-file HTML diagrams: architecture, flowcharts, sequence diagrams, data flows and state machines. Validates output automatically and exports PNG or SVG.
tt-a1i/archify86.5k
HyperFrames
CLIWrite videos in HTML, CSS and frame-seekable animations, preview them from the CLI and render deterministic MP4s. Comes with agent skills for product launch videos, captions and talking-head re-edits. Maintained by HeyGen; needs Node.js 22+ and FFmpeg.
heygen-com/hyperframes68.3k
HyperFrames Skills
SkillHeyGen's official HyperFrames skill set: lets agents write deterministic MP4 videos in HTML, CSS and animation, with workflows for promo videos, explainers, captions and beat-synced music. Needs Node.js 22+ and FFmpeg.
heygen-com/hyperframes68.3k
Diagram Design
SkillGenerates self-contained HTML+SVG diagrams in an editorial style: architecture, flowcharts, sequence, swimlane, Gantt and dozens more types. Can match brand colors from a website and redraw imported Mermaid, draw.io and Excalidraw sources.
cathrynlavery/diagram-design58.9k
Playground
PluginHas the agent build single-file HTML interactive playgrounds: visual controls on one side, live preview on the other, and a prompt to copy back into Claude. Templates for design tuning, data exploration, concept maps, doc annotation, code review and architecture diagrams. By Anthropic.
anthropics/claude-plugins-official43.4k
Frontend Slides
SkillGenerates zero-dependency, animated HTML slide decks: previews several visual styles to choose from first, and can convert PowerPoint decks to web slides. Made for non-designers who don't write CSS.
zarazhangrui/frontend-slides31k
Guizang PPT Skill
SkillGenerates single-file HTML slide decks with horizontal paging and two built-in visual systems (editorial magazine and Swiss International style), plus presenter mode with speaker notes. Can also make slide illustrations and covers for various platforms. By Guizang.
op7418/guizang-ppt-skill28.3k
Huashu Design
SkillHave an agent produce high-fidelity clickable prototypes, editable slides, timeline animations (exportable to MP4/GIF) and infographics in HTML from one sentence. Proposes three design directions first and includes a five-dimension design review. By Huashu, MIT licensed.
alchaincyf/huashu-design25.6k
Codebase to Course
SkillTurns any codebase into an interactive browser course: real code with plain-language explanations, animations, hover glossaries and scenario quizzes. Built for people who build software with AI but can't read code, and useful for intro programming classes. Needs only an agent and the repo.
zarazhangrui/codebase-to-course5.7k
Bencium Innovative UX Designer
SkillDevelops an original visual language for a brand, campaign, publication, site or product. Without looking at contemporary design, it builds ten typography-only HTML directions; once you lock one, it turns it into a production system. Not for routine UI fixes or existing design systems.
bencium/bencium-marketplace460
Slide Wright
SkillTurns a topic, rough notes or an outline into an animated web slide deck. Invents a custom theme, shows a two-slide preview and builds the full single-file HTML deck with speaker notes only after you approve. Also edits existing reveal.js decks and can export PDF or deploy.
arifszn/slide-wright61