104 tagged motion graphics, measured the same way as everything else here.
Browse within: animation 60design-tools 58motion-design 58claude-skill 16remotion 15after-effects 10adobe-after-effects 9ReAct 8typescript 8video 7explainer-video 6animated-diagram 5diagram-animation 5year-in-review 5
Skill Claude CodeCodex
Turn ONE topic into a finished Vox-style paper-collage explainer / ad video, end to end on the Atlas Cloud API + local ffmpeg — script, collage keyframes, motion, voice-over, music, captions, all automated. Use this whenever the user wants a "Vox style" video, a paper/torn-paper collage animation, a "motion collage"…
Skill Claude CodeCodex
Fade Big — a composable AnimXYZ entrance via the xyz="fade big-50%" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
Skill Claude CodeCodex
Fade Down — a composable AnimXYZ entrance via the xyz="fade down-3" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
Skill Claude CodeCodex
Fade Left — a composable AnimXYZ entrance via the xyz="fade left-3" attribute. Declarative: mix fade + move + scale + rotate without writing keyframes. MIT. Honors prefers-reduced-motion.
Skill Claude CodeCodex
Pre-built animated React component collections combining Magic UI (150+ TypeScript/Tailwind/Motion components) and React Bits (90+ minimal-dependency animated components). Use this skill when building landing pages, marketing sites, dashboards, or interactive UIs requiring pre-made animated components instead of…
Skill Claude CodeCodex
Professional React animation skill for creating Awwwards/FWA-level animations using GSAP (useGSAP), Motion (Framer Motion), Anime.js, and Lenis. Use when building premium scroll experiences, custom cursors, page transitions, text animations, parallax effects, micro-interactions, or any animation that needs to be 60fps…
Skill Claude CodeCodex
Video and audio processing with FFmpeg. Use for format conversion, resizing, compression, audio extraction, and preparing assets for Remotion. Triggers include converting GIF to MP4, resizing video, extracting audio, compressing files, or any media transformation task.
noamdorr/saas-product-demo-video
Skill Claude CodeCodex
Produce a 20-45s SaaS product demo video in Remotion. Use whenever the user wants to make a product film, marketing reel, explainer, launch video, or LinkedIn/Instagram video of their app - including requests like "make a video of my product", "remotion video", "product demo reel", "launch film", "vertical reel"…
Skill Claude CodeCodex
Design and build a finished motion piece (default vertical 1080×1920; landscape/square also supported) from a brief through the 甲乙环 (critic-loop) pipeline — a unified design+build agent (乙) drafts a design and writes the Remotion code in one continuous context; N independent draws are blind-selected for the most…
Skill Claude CodeCodex
The blind-select + critic-loop (盲选 + 甲乙环) stage of the remotion-director pipeline — how to pick the most promising base among N draws, then run the design-blind aesthetic critic (甲) against the builder (乙), round after round until it converges, with the orchestrator ferrying verdicts verbatim. Loads the two…
Skill Claude CodeCodex
The design knowledge (设计大脑装备) for the remotion-director builder (乙). Loads the full design equipment — the motivational framing, §0 心法, §1 visual conceit, §2 the 3-step process (narrative → texture → engine plan, order is a hard rule), §3 build discipline, §4 render self-check (you-the-designer signing off on real…
Skill Claude CodeCodex
Create and iterate motion-graphics videos (mp4) — title cards, lower thirds, kinetic typography, product teasers, data-driven video batches. Use when the user asks to make, edit, retime, personalize, or add sound to an animated video. Scenes are declarative data; renders are deterministic; human edits survive…
iart-ai/explainer-video-skills
Skill Claude CodeCodex
This skill should be used when the user asks to "make an explainer video", "turn this into a short explainer", "write a script and storyboard for a product video", "produce a how-it-works/onboarding video", "sync narration and captions", or "build a 30–90s animated explainer". Covers script→storyboard→scene…
iart-ai/explainer-video-skills
Skill Claude CodeCodex
This skill should be used when the user asks to "make a whiteboard animation", "draw-on explainer", "VideoScribe style", "hand-drawn explainer video", "animate a sketch being drawn", "do a doodle/scribe video", "show a hand drawing the illustration", or "animate handwriting appearing on a whiteboard". Covers SVG…
iart-ai/explainer-video-skills
Skill Claude CodeCodex
This skill should be used when the user asks to "make a Spotify Wrapped style video", "build a year in review / year-in-review video", "create a personalized data video", "generate a recap video", "build a wrapped video generator", "turn a data table into shareable videos", or "make per-user stat videos". Covers the…
Skill Claude CodeCodex
Use when an already-cut talking video and its final matching SRT need content-aware MG, presenter composition, screen-recording integration, subtitles, or final visual packaging.
iart-ai/kinetic-typography-skills
Skill Claude CodeCodex
This skill should be used when the user asks to "animate a headline", "make a kinetic typography video", "do a split-text reveal", "stagger text by character/word/line", "make a lyric or caption video", "animate a variable font weight", "put text on a path", or "create an animated title card". Covers reveal techniques…
iart-ai/webgl-animation-skills
Skill Claude CodeCodex
This skill should be used when the user asks to "build a particle system", "make confetti/snow/smoke/sparks", "create a connected-dot/constellation network background", "add a flow-field or curl-noise particle effect", "render thousands of GPU particles with Three.js Points", or "animate emitters with forces". Covers…
iart-ai/webgl-animation-skills
Skill Claude CodeCodex
This skill should be used when the user asks to "write a fragment shader", "make a GLSL gradient/noise/plasma background", "create an image transition (dissolve, displacement, glitch)", "add distortion or chromatic aberration", "build an SDF shape shader", "wire up a Three.js ShaderMaterial with uniforms", or "do GPU…
iart-ai/webgl-animation-skills
Skill Claude CodeCodex
This skill should be used when the user asks to "build a 3D hero section or WebGL background", "animate a Three.js scene", "play or crossfade GLTF animation clips", "move/lerp the camera or link it to scroll", "render thousands of objects with InstancedMesh", "set up React Three Fiber (R3F) motion", "add bloom/DOF…
Skill Claude CodeCodex
This skill should be used when the user asks to "add animated captions", "make TikTok captions", "karaoke captions", "word-by-word subtitles", "auto subtitles", "highlight the active word", "burn in captions to a video", "sync captions to a voiceover/narration", or "turn an SRT/transcript into animated text". Covers…
Skill Claude CodeCodex
This skill should be used when the user asks to "make a countdown timer video", "create a countdown animation", "build a stream starting soon countdown", "do an event/launch/sale countdown", "animate a mm:ss or dd:hh:mm:ss timer", "add digit roll/flip transitions to a counter", or "loop a countdown background". Covers…
Skill Claude CodeCodex
This skill should be used when the user asks to "make an animated lower third", "add lower thirds", "create a name tag/name lower third", "build broadcast titles", "animate a title/name/role caption", "do a speaker name overlay", or "template lower thirds across a list of names". Covers enter/exit animation…
gquthier/autonomous-shortform-facecam-editing
Skill Claude CodeCodex
Transformer une prise talking-head brute (une personne face caméra) en pub motion-graphics 9:16 prête pour Meta/TikTok — pré-cut des silences, recadrage serré carré + plein cadre centré visage (miroir optionnel), transcription mot-à-mot, charte volée au site, storyboard « une carte par phrase » (count-ups, listes…