Skip to content
Get Friday PicksSubmit
SkillClaude Code logoClaude CodeCodex logoCodexMotion GraphicsVerified

anidoodle: hand-drawn illustrations and films, all in code

Your agent draws pictures, looping animations, interactive web art and short films with a composed soundtrack in 32 hand-drawn styles, and the same code renders the exact same result every time.

In short: Your agent draws pictures, looping animations, interactive web art and short films with a composed soundtrack in 32 hand-drawn styles, and the same code renders the exact same result every time. It is a free skill for people who use Claude Code or Codex and want help with motion graphics.

Checked on · Added

Open on GitHub · ★ 1k

Works with

Agent / toolAccess / costLink
Claude CodePaid Claude plan or APIclaude.com/claude-code
CodexChatGPT plan or APIopenai.com/codex
GitHub repoOpen source · ★ 1kalexgreensh/anidoodle
anidoodle: hand-drawn illustrations and films, all in code

Image: from the GitHub README, shown with credit.

Image from the alexgreensh/anidoodle README

Images from the project README on GitHub.

Reference videos (3)

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

Clawd's Halloween, drawn and scored in code with anidoodle thumbnailMOTION1:11

Clawd's Halloween, drawn and scored in code with anidoodle

The skill author asked the agent for a Halloween short: Clawd goes trick-or-treating for tokens dressed as other agents, with every frame, the music and 100+ hidden jokes written in code.

anidoodle@alexgreensh♥ 315
"How do you draw an owl?" answered as a drawing lesson thumbnailEXPLAINER0:52

"How do you draw an owl?" answered as a drawing lesson

One question turned into a step-by-step lesson: an owl drawn from two circles to the finished feathers, with captions for each step, all generated in code.

anidoodle@alexgreensh♥ 115
anidoodle's own launch film, 100% code thumbnailLAUNCH1:17

anidoodle's own launch film, 100% code

The launch video for the skill, made with the skill: a koi pond, 31 styles, loops, a web mascot and a clockwork butterfly film, music included.

anidoodle@alexgreensh♥ 69

Try it in 60 seconds

/plugin marketplace add alexgreensh/anidoodle
/plugin install anidoodle@alexgreensh-anidoodle
codex plugin marketplace add alexgreensh/anidoodle

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

What it does

Your agent draws pictures, looping animations, interactive web art and short films with a composed soundtrack in 32 hand-drawn styles, and the same code renders the exact same result every time.

anidoodle is an agent skill for art made entirely in code: illustrations, drawing timelapses, loops, interactive web illustrations and short films with an original score, in 32 hand-drawn styles. Every mark is a…

Short excerpt from the README of alexgreensh/anidoodle. Read the full README on GitHub.

Inside the repo

32 styles to choose fromEvery style draws itselfMusic, composed in codeWeb pages that notice youLaunch your product, drawn in codeBring your own imageLearn to drawWhat you can makeWhat it packsIt draws, then it movesPay once, draw foreverGet started

Step by step

  1. Open the GitHub repo and read the README.
  2. In Claude Code: /plugin marketplace add alexgreensh/anidoodle, then /plugin install anidoodle@alexgreensh-anidoodle. In Codex: codex plugin marketplace add alexgreensh/anidoodle, then install it from /plugins.
  3. Make sure Node 20+ is installed; anything that moves also needs ffmpeg.
  4. Ask in plain words, e.g. "a risograph lighthouse for our careers page, 1600x900" or "a 30-second launch film for my app", and approve the first still before it animates.

Watch out for

Films and long pieces take many rounds and a lot of tokens; prove the look on one still first. The optional real-instrument sound pack is a 373 MB download (the agent asks first). Rendering uses a headless Chromium via Playwright.

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
huashu-art-motion: animate artwork in 35 art styles thumbnailSKILL

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.

Claude Code logoCodex logoClaude Code +1★ 4.2k
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

Free newsletter

Friday Picks

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

Free. No spam. Unsubscribe anytime.