Meng To's Agent Skills
Agent Skills
A skill library for expressive landing pages, animation, WebGL and Three.js browser games, with demos and prompts
- 7,117 ★ on the repository
- Last commit
- MIT
Extended access
Why this level
- Some skills run page capture and video recording scripts
- A few skills call external APIs such as ElevenLabs
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add skills/mengto-skillsDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewExtended accessThe tool runs code or makes network calls and only reads external data.
- Some skills run page capture and video recording scripts
- A few skills call external APIs such as ElevenLabs
This is third-party code. Review the repository files before installing.
What it does
Designer Meng To's library is made of portable folders with SKILL.md, references, scripts and plain HTML demos. The largest section covers web design: landing and pricing pages, scroll animation with GSAP and Lenis, WebGL effects, CSS techniques and dozens of ready visual styles. The games section lays out Three.js browser game architecture: levels, combat, enemies, inventory, VFX, optimization and testing. Workflow skills turn a screen recording into a detailed prompt, capture full pages, break HTML into prompts for single interactions and audit generic AI-looking design.
Who it is for. For designers and frontend developers building animation-heavy promo sites or browser games with an agent.
Good fit when
- You need a landing page with a distinct visual style and motion
- You want to recreate an effect from another site from video or HTML
- You need a Three.js browser game with a clear architecture
Not a fit when
- You need a restrained product UI rather than a promo site
- You need one-command install, which the README does not describe
Example request
Use the landing-page skill to build a booking service landing page in the clean-minimal-beige-light-mode styleLimitations
The README has no install command: copy skills into the agent's directory or load them as context by hand. Some workflow skills target Codex and the author's personal routines, such as X post drafts. Some rely on paid services like ElevenLabs and Aura.
How to disable. Delete the copied skill folders from the agent's skills directory or remove references to them from CLAUDE.md and Cursor rules.
FAQ
Which skills should I start with?
The author suggests the web design chain: video-to-superprompt, html-to-interaction-prompts, stitched-full-page-capture and daily-ui-inspiration-capture.
Are there sample results?
Yes, visual skills include HTML demos and prompt files for recreation, listed in DEMOS.md.
Discussion
No questions or reviews yet.
Related
SkillsA registry of installable design skills: ready SKILL.md and DESIGN.md files with tokens, component rules and accessibility for different styles
Skills for design engineers: quick UI cleanup, accessibility, metadata and animation performance fixes
Skills against boilerplate-looking UIs: layout, type, motion and spacing, plus reference image generation for web and mobile
A UI, presentation and graphics design skill for coding agents: canvas drafts driven through the superdesign CLI
Ten reference skills for Three.js: scene setup, geometry, materials, lighting, shaders, animation and post-processing
AI Design Skills
landing-page-design
A skill for building a landing page from scratch: intake questions, page structure, conversion copy and a strict visual system
README in short
The README explains the library's purpose, four starter web design skills and how to use the folders in Codex, Claude Code and Cursor. It sets out the author's principles, the skill folder layout with demos and references, and an overview of sections: workflows, media, UI, game development and web design. It also documents how to add skills. MIT licensed.
README badge
Original SKILL.md
--- name: article-prompts-to-skills description: Convert an article, tutorial, or prompt pack into focused reusable AgentSkills, one independent capability per skill, with portable instructions, example prompts, working demos, preview screenshots, validation, gallery updates, and a narrow commit. Use when the user asks to turn an article's prompts, tutorial sections, design patterns, interactions, or workflow ideas into complete skills rather than leaving them as prose. --- # Article Prompts to Skills Turn source prompts into small, demonstrable capability packages. Preserve the useful behavior, not the source page's brand or layout. ## 1. Inspect Before Extracting 1. Read the repository instructions and the complete source article. 2. Run `git status --short`; preserve unrelated work. 3. Inventory every explicit prompt, heading, example, asset, and acceptance criterion. 4. Search existing `SKILL.md` files for overlapping capabilities before creating folders. 5. If the source is raw HTML and the prompts do not exist yet, use `$html-to-interaction-prompts` first, then return here. Do not infer a family of skills from a title alone. Trace each proposed skill to source evidence. ## 2. Build an Extraction Ledger Create a working table before editing files: | Source prompt | Reusable capability | Keep | Remove | Skill name | Demo proof | | --- | --- | --- | --- | --- | --- | Apply these boundaries: - Create one skill per independently reusable behavior. - Merge steps only when separating them would make either step unusable. - Update an existing skill when its contract already covers the capability. - Skip decorative or editorial fragments that do not create a repeatable method. - Name skills after the outcome or mechanism, never after the source article.