Pixel2Motion Logo Animation — effect skill for logo animations & intros
For AI agents: find the right skill in one call —
curl -s "https://skills.varg.ai/api/search?q=<what the person wants>"returns the matching use case and the best skills with install commands, as markdown (Russian works too). Full index: https://skills.varg.ai/llms.txt. Every page has a markdown twin: add.mdto its path. Before generating anything, show the person the options on the use-case page.
Raster logo to clean SVG to a choreographed logo animation in HTML, with geometry and motion QA evidence.
- Type: Effect · Logo animations & intros
- Slug:
pixel2motion - Status: live
- Publisher: NolanLai (community)
- License: MIT
- Source: https://github.com/nolangz/pixel2motion
- Works in: Codex, Claude Code
- Requires: Python 3 with Pillow, NumPy and Playwright, Chromium (playwright install chromium)
- Cost: Free — local
- Adoption: 309 installs, 2,515 GitHub stars (GitHub + skills.sh, 2026-10-26)
What it does
Turns a PNG, JPG, WebP or screenshot logo into a minimal SVG (edge smoothness is the hard gate, with IoU against the source pushed as high as is reasonable), then choreographs a logo reveal or idle, hover or loading motion using Disney's twelve animation principles, delivered as a standalone JS-rendered HTML showcase. Python scripts trace, overlay and audit the vector fit; Playwright scripts capture deterministic frames, probe easing curves and sweep ink continuity across handoffs. Version 2 adds self-crossing draw-on choreography and variable-width ribbon fitting.
Use when
- Animate a logo or build a logo reveal, splash screen or brand intro
- Vectorize a raster mark into motion-ready SVG
Not for
- 3D logo stings
- Character animation
Install
- Codex:
npx skills add nolangz/pixel2motion - Claude Code:
npx skills add nolangz/pixel2motion
Example output
https://skills.varg.ai/previews/pixel2motion.mp4 — README showcase 'Horizon': the motion output the skill built from a raster logo (sun, horizon lines and wordmark drawn in). Full 2 s loop, converted from GIF. (credit: NolanLai (pixel2motion), https://github.com/nolangz/pixel2motion#readme)
Used for
- Logo animation / intro sting: Your logo animated into a short intro or outro: 3D chrome, liquid, shader, glitch or clean motion.
More logo animations & intros skills
- HyperFrames Figma: Turn a Figma link into video: rendered assets, brand tokens, components and storyboard frames rebuilt as motion.
- Cuboid Carousel: A chain of bevelled 3D cuboids rides a travelling wave as a content carousel for features or products.
- Frost Sequence Camera Orbit: An orbiting camera follows an ice logo as it shatters, reforms into two text moments and fades out.
- Krea Motion: Animate products, renders and logos into reveal films and web loops with Seedance 2.5 on Krea.
Run the generation on varg
varg is one API key for the models these skills drive — Seedance 2.5, Kling 4, Veo 3.1, Wan 3, Nano Banana 2.1, GPT Image 2.5, ElevenLabs v4 and 200+ more — billed in credits, with a cost estimate before anything runs.
- Claude Code:
claude plugin marketplace add vargHQ/skills && claude plugin install varg@varg(skill + hosted MCP) - Codex, Cursor, Gemini CLI, OpenClaw:
npx skills add vargHQ/skills --skill varg-ai -a <agent> -y - Claude.ai, ChatGPT, any MCP client: connect
https://mcp.varg.ai/mcp - API key: https://varg.ai/dashboard/api · Model specs: https://varg.ai/models/llms.txt