Skip to content
Get Friday PicksSubmit

huashu-art-motion: animate artwork in 35 art styles

Brings paintings and illustrations to life with code, offering dozens of art styles and several narration patterns for art-explainer videos.

In short: Brings paintings and illustrations to life with code, offering dozens of art styles and several narration patterns for art-explainer videos. It is a free skill for people who use Claude Code or Codex and want help with motion graphics.

Checked on · Added

Works with

Agent / toolAccess / costLink
Claude CodePaid Claude plan or APIclaude.com/claude-code
CodexChatGPT plan or APIopenai.com/codex
GitHub repoOpen source · ★ 4.2kalchaincyf/huashu-art-motion
huashu-art-motion: animate artwork in 35 art styles

Image: from the GitHub README, shown with credit.

Image from the alchaincyf/huashu-art-motion README

Images from the project README on GitHub.

Reference videos (2)

Real videos made with this skill, credited to their creators. Hover to preview.

Whiteboard explainer of how huashu-art-motion works thumbnailEXPLAINER0:21

Whiteboard explainer of how huashu-art-motion works

A hand-drawn style walkthrough, made with the skill, of its own method: get one frame right, then animate it.

huashu-art-motion@AlchainHust♥ 150
Art-style journey from Dunhuang to ink wash, huashu-art-motion thumbnailMOTION0:15

Art-style journey from Dunhuang to ink wash, huashu-art-motion

The skill author chains several painting styles in one animation while keeping the same character on screen.

huashu-art-motion@AlchainHust♥ 145

Try it in 60 seconds

npx skills add alchaincyf/huashu-art-motion
uv run --with playwright python scripts/engine/render.py --solo 09_postimp --stills 0.3 --out 试渲   # 梵高那一段的一帧
uv run --with playwright python scripts/engine/render.py --spec scripts/engine/examples/t3_finance_chart.json --out 财经图表.mp4

Install command copied from the project README. Check the README for the latest version.

What it does

Brings paintings and illustrations to life with code, offering dozens of art styles and several narration patterns for art-explainer videos.

- 2026-10:Open Design(nexu-io 出品的开源 AI 设计工作区)的 motion-design skill 把 huashu-art-motion 列为设计来源之一,并在 skills/huashu-art-motion 收录了一份适配版,保留了 MIT 许可和上游出处。很高兴这套艺术动画的做法被另一个开源项目用起来,谢谢 Open Design 团队。也欢迎更多项目使用、反馈和贡献。

Short excerpt from the README of alchaincyf/huashu-art-motion. Read the full README on GitHub.

Inside the repo

动态动画样片核心案例:花叔闯进超级玛丽Clawd 博物馆奇妙夜花叔穿越名画看效果能做什么里面有什么背后的故事致谢关于作者许可证

A prompt to try

Using huashu-art-motion, make a 40s explainer that animates [artwork] in a matching art style, with narration.

Written by us so you can reuse it. Replace each [bracket] with your details.

Step by step

  1. Open the GitHub repo and read the README (install commands change often).
  2. Install it with the command in the README, or copy the skill folder into ~/.claude/skills/ (Claude Code) or ~/.codex/skills/ (Codex).
  3. Restart your agent so it picks the skill up.
  4. Ask for the video in plain words and review drafts before the final render.

Docs, demos & materials

Sources & credit

All credit to the original authors. We rewrite in our own words and link back. Something wrong? Report it.

Related skills and use cases in Motion Graphics

See all Motion Graphics entries →

Related

HyperFrames: write HTML, get a video thumbnailSKILL0:56

HyperFrames: write HTML, get a video

Open-source renderer that turns HTML/CSS/JS scenes into frame-exact MP4s; built so coding agents can drive it.

Claude Code logoCodex logoClaude Code +1★ 63.8k
/brag: turn a finished project into a launch video thumbnailSKILL0:34

/brag: turn a finished project into a launch video

Type /brag in a project; it reads the code and renders a ~20s launch film with music, captions and share copy.

Claude Code logoCodex logoClaude Code +1★ 16k
Anatomy: interactive isometric illustrations thumbnailSKILL0:28

Anatomy: interactive isometric illustrations

Draws detailed, interactive isometric cutaways of real objects as code; a port also runs in ChatGPT/Codex.

Claude Code logoCodex logoClaude Code +1★ 10.6k
GSAP official agent skills thumbnailSKILL

GSAP official agent skills

Official skills from GreenSock that teach agents to write correct, smooth GSAP animations.

Claude Code logoCodex logoClaude Code +1★ 16.4k
lemo-opuscar: short films in 51 styles, no video model thumbnailSKILL

lemo-opuscar: short films in 51 styles, no video model

A Claude Code skill that makes short films entirely in code, choosing from 51 film styles each backed by its own style recipe.

Claude Code logoClaude Code★ 2.7k
motion-skills: 50 packs (Reels, explainers, data-viz, Manim) thumbnailSKILL

motion-skills: 50 packs (Reels, explainers, data-viz, Manim)

Install a pack and your agent works like a motion designer for TikTok/Reels, explainers, charts and WebGL.

Claude Code logoCodex logoCursor logoClaude Code +2★ 812

Free newsletter

Friday Picks

New AI tools you can use right away, in plain words. Every Friday.

Free. No spam. Unsubscribe anytime.