Huashu Design
alchaincyf · Skill
Turns a one-line request in your AI agent into a finished design: a launch animation, a clickable app prototype, an editable slide deck, an infographic or a se…

Meng To’s library of more than 170 agent skills for designers and builders. It covers web design, 3D, illustration, games and agent workflows, and starts with four skills that study a reference video or page for a build prompt.
Meng To Agent Skills is an open-source project on GitHub in the Developer category, listed by Mindket. It is free. This is version 2, last updated on . Install it from GitHub as its README says. Get Mindket’s setup notes on your Mindket account, as a zip.
find agent-skills -name SKILL.md | sort
Meng To Agent Skills is Meng To’s library of more than 170 skills for designers and builders who work with coding agents. It covers landing pages, scroll and shader effects, 3D scenes, hand-written SVG illustration, playable browser games and the habits of working with an agent day after day. Each skill is a short procedure with defaults, snippets and pitfalls. The README starts with four web-design skills that study references such as a video, an HTML page or a landing page for an AI builder.
Designers and front-end developers who build pages, motion and 3D scenes with a coding agent, and game makers who work in Three.js. People who run an agent every day will also find the workflow skills. Many skills are narrow, such as one scroll effect or one illustration style, so you pick a few and leave the rest.
| Group | Start with | A request it answers |
|---|---|---|
| Codex workflows | video-to-superprompt | Turn a screen recording into a detailed prompt that rebuilds the page |
| Media | aura-asset-images | Find five strong background images for a design mockup |
| UI | design-first-ui-prompting | Write a UI prompt as a spec: goal, format, layout, type, color and constraints |
| Illustration | illustration-ink-sketch | Draw a Cache Miss card for a 404 page |
| Game combat | game-dev-combat-skill-polish | Score combat skills out of 10 with two blind judges and raise the weakest |
| Game development | build-isometric-arpg | Build a playable action-RPG loop in vertical slices |
| Web design | landing-page | Design or rewrite a landing page around one offer, one audience and one action |
| Workflow | workflow-score-to-target | Score work out of 10 and improve it round by round until every item reaches the bar |
| 3D | 3d-ultra-realistic-water | Add an open ocean with sun glitter, lace foam and a ship’s wake |
Any coding agent that reads Markdown. The README names four routes.
$name, which the maker’s guides showGet it saves a zip of Mindket’s setup notes in your downloads folder. The README gives no install command and lists install notes as a later idea. The steps below are Mindket’s suggestion, built on its advice to copy a skill into your agent’s skills folder.
| Need | Detail |
|---|---|
| A coding agent | Claude Code, Codex, Cursor or another that reads Markdown |
| Git | To download the repository from GitHub |
| Node.js, Python 3 or a browser | Only for the skills that ship scripts or demos |
| Accounts and keys | None for the library. A few skills use a service you set up yourself, such as ElevenLabs |
~/.claude/skills for personal skills, and the kit’s notes give Codex and Cursor./reload-skills.find agent-skills -name SKILL.md | sort
Run it inside the downloaded folder, and on Windows in a bash shell such as Git Bash. Then copy the whole folder of the skill you want, such as agent-skills/web-design/landing-page, so its SKILL.md lands at ~/.claude/skills/landing-page/SKILL.md.
A directory site, skills.sh, also lists this repository with the command below, which asks you to choose skills and agents. It needs Node.js 22.20 or later, and the maker’s README does not mention it.
npx skills add mengto/skills
Name the skill in your request, or describe the job and let Claude match it. Each SKILL.md says when to use it and what to do first. Use the narrowest skill that fits, and combine skills only when the task needs it.
| Skill | You give it | Claude does |
|---|---|---|
| video-to-superprompt | A screen recording or link to a design, page or animation | Checks the file with ffprobe, pulls frames with ffmpeg, studies the story, layout, motion and type, and writes one paste-ready prompt with an asset map |
| html-to-interaction-prompts | An HTML page, such as one made in Aura Build | Splits it into reusable prompts for one section, animation, button, hover state or effect, with screenshots as evidence |
| stitched-full-page-capture | A live landing page that lazy-loads or animates | Scrolls it, captures settled screens and stitches them into one tall image that is not blank or gray |
| daily-ui-inspiration-capture | A recurring job of collecting reference pages | Browses, captures and studies strong landing pages, then writes prompt packs from them |
You found a landing page animation you like and recorded your screen while it played.
Use the video-to-superprompt skill on recording.mp4 and write one prompt that rebuilds this page.
Claude checks the file with ffprobe, pulls frames with ffmpeg and returns one paste-ready prompt with an asset map.
The prompt walks the page section by section, with its layout, motion, scroll behavior and type, and it always covers mobile and reduced motion. ffprobe and ffmpeg need to be installed for that first step.
If you are new. A skill is a folder with a SKILL.md that tells your agent when to use it and what to do. You do not need the whole library. Start with one that fits a job you have this week, such as landing-page for a page or video-to-superprompt for a reference. Leave the others out of your skills folder, so your agent reads only what you chose.
For experts. The README’s folder contract has SKILL.md required, REFERENCES.md for links only, ARTICLE.md for long text, and optional assets, scripts and demo folders. Many skills carry a demo page you can serve locally with this command from the downloaded folder, with your group and skill in place of the two names.
python3 -m http.server 4173 -d agent-skills/<category>/<skill-name>/demo
The illustration skills carry a renderer and a linter, and the renderer needs playwright-core and a Chromium. The repository also holds its own CLAUDE.md for agents that edit the repository itself. It tells them to keep skills short and procedural.
Most skills are plain instructions, and a few touch your accounts or your files.
.env file. x-bookmark-quote-posts reads your X bookmarks in the Codex in-app browser, signed in, and its text says never to post or change anything there# Meng To Agent Skills: setup notes This kit holds setup notes written by Mindket. It does not contain the skills, their demos, scripts or assets. Those come from Meng To’s repository: https://github.com/MengTo/Skills License: MIT, Copyright (c) 2026 Meng To. Full text: https://github.com/MengTo/Skills/blob/main/LICENSE These are community skills by Meng To. They are not made or endorsed by Anthropic, OpenAI, Cursor or Aura Build. The pages these notes came from: the README (https://github.com/MengTo/Skills/blob/main/README.md), DEMOS.md, the repository’s own CLAUDE.md, the guides for the 3D, illustration, game development and workflow groups, and the SKILL.md files of the four starting skills and a few others, all under https://github.com/MengTo/Skills/tree/main/agent-skills. Facts about where Claude Code, Codex and Cursor load skills come from their own pages: https://code.claude.com/docs/en/skills, https://developers.openai.com/codex/skills and https://cursor.com/docs/skills. Mindket read the README, the group guides and the opening parts of 20 SKILL.md files, which is a small part of the library. It copied every command and ran none of them. ## What it is A large library of agent skills for designers and builders: web design, 3D rendering, illustration, games, agent workflows and automations. The README says it holds more than 170 skills in nine groups, and that each skill is a folder with a SKILL.md and, for some, references, scripts, assets and a demo page. The skills are written as short procedures with defaults, snippets and pitfalls, not essays. The README starts with four web-design skills and calls them the flagship workflow: - video-to-superprompt: a screen recording of a design, landing page or animation becomes one detailed prompt for building it - html-to-interaction-prompts: an HTML page becomes reusable prompts for one section, animation, button, hover state or effect - stitched-full-page-capture: a full-page screenshot of a lazy or animated page that is not blank or sparse - daily-ui-inspiration-capture: browsing, capture, study and prompts turned into a loop that makes prompt packs ## The nine groups | Group | What is in it | |---|---| | Codex workflows | Capture, prompt and recording skills, plus ElevenLabs voiceover, X post drafting and publishing a project to GitHub | | Media | Stock-style image sourcing from Aura Assets and from Unsplash | | UI | Design-first prompting for UI | | Illustration | Fourteen hand-written SVG illustration styles, each with a palette, drawing kit and linter | | Game combat | Combat animation and effect languages for fire, ice, lightning and water skills | | Game development | Playable Three.js and browser-game workflows, from camera and enemies to QA and release | | Web design | Landing and pricing pages, Tailwind, GSAP, Three.js, scroll and shader effects, layouts and visual styles | | Workflow | Progress screenshots, scoring to a target, shipping a change, and overseeing many agent threads | | 3D | Water, god rays, skies, leaves, seasons, textures, models, materials and Retina rendering | Source: the README’s “Current library” section and the group guides. ## Files in this kit - setup/claude-code.md: copying a skill into Claude Code’s skills folder, with the README’s own advice for Claude Code - setup/codex.md: using a skill in Codex, with the `$name` form the guides show - setup/cursor.md: Cursor’s rules and skill folders - setup/other-agents.md: any other agent, and a chat with no coding agent - setup/demos-and-helpers.md: the demo pages, the maker’s list command and the helper scripts that need extra tools ## What you need first - A coding agent that reads skills or Markdown files: Claude Code, Codex, Cursor or another. - Git, or another way to download the repository from GitHub. The README prints no download command. - Node.js, Python 3 or a browser only for the skills that ship scripts or demos (setup/demos-and-helpers.md). - No account or key for the library itself. ## Skills that need an outside service Most skills are plain instructions. A few touch a service you set up yourself: - elevenlabs-tts reads an ElevenLabs key from your environment or a `.env` file and keeps voice profiles in a config file outside the skill. - aura-asset-images and unsplash-asset-images point the agent at Aura’s and Unsplash’s public image libraries. - x-bookmark-quote-posts reads your X bookmarks in the Codex in-app browser, signed in to X. Its SKILL.md says it must not post, reply, like or change anything on X. - write-like-meng-on-x is tuned to Meng To’s own voice and content repository, so it writes as Meng To. For your own voice, that material would have to be your own. ## Update and remove The README gives no update or removal step. The repository is a plain folder of files, so an update is a fresh copy of the skill’s folder and a removal is deleting the copy you made. Claude Code’s skills page says to remove a personal or project skill by deleting its folder.
README.md 5 KB setup/claude-code.md 3 KB setup/codex.md 2 KB setup/cursor.md 2 KB setup/demos-and-helpers.md 2 KB setup/other-agents.md 2 KB
Updated by Mindket to the current version of this kit.
Posts and comments that name this project on Hacker News, Bluesky, X, Reddit, Facebook and YouTube, found by a weekly search and on Trendshift. Mindket doesn’t write or check them. Open one to read it where it was posted.
alchaincyf · Skill
Turns a one-line request in your AI agent into a finished design: a launch animation, a clickable app prototype, an editable slide deck, an infographic or a se…
op7418 · Skill
Skill that makes single-file HTML slide decks, slide illustrations and platform covers in two visual styles, with a presenter mode for rehearsal. For speakers…
alirezarezvani · Skill
Adds 411 ready-made skills for Claude Code and other coding agents, grouped by role from engineering and product to marketing, finance and compliance. Installs…
block · Kit
Self-hostable workspace where people and AI agents share the same rooms, built on a Nostr relay that logs every action as a signed event. For teams that want t…
backnotprop · Kit
Opens your AI coding agent's plans, specs and code changes in a browser so you can annotate or comment on them and send the feedback straight back to the agent.
alibaba · Kit
Reviews Git changes with an AI agent that reads files and searches the codebase, then writes comments tied to exact lines. It suits developers who want automat…