Animation & Graphics

nexu-io Bundle

Generates a single-frame HTML template with a cinematic film-leak aesthetic: warm light leaks, 35mm grain, 2.39:1 letterbox, and serif typography for opening titles or chapter cards.

remotion-dev Bundle

Guides building video-generation SaaS apps with Remotion, covering framework selection, the Player component, and rendering options across Lambda, Vercel, Node.js, and Cloudflare.

remotion-dev Bundle

Guidance for writing Remotion React markup with animation patterns, media handling, sequences, effects, and advanced features like 3D, audio visualization, and parameterized videos.

xiaopu-ai Bundle

Takes a PRD, reference URL, screenshot, or keywords to produce a DESIGN.md specification, then generates production-ready web code that meets UI/UX, visual, motion, and responsive standards.

sakamoto-family-smile Skill

Implements accessible, performant animations and transitions in React/Next.js apps using Motion, with tokens, reduced-motion support, and device adaptation.

lord1egypt Skill

Builds creative browser demos with @chenglou/pretext for DOM-free text layout, enabling ASCII art, typographic flow around obstacles, text-as-geometry games, kinetic typography, and text-powered generative art. Produces single-file HTML demos by default.

sdiamante13 Bundle

Loads Remotion best practices for React video creation, covering animations, composition setup, assets, audio, captions, sequencing, transitions, media metadata, Three.js, Tailwind, and rendering patterns.

scoheart Bundle

Adds smooth, native-feeling animations to React apps using the View Transition API, covering shared elements, route changes, and list reordering with CSS-based control.

mhassan0000 Skill

Creates 3D elements and interactive browser experiences with Three.js, covering scenes, materials, controls, and post-processing.

samuelpatro Skill

Translates Apple's fluid interface design principles—springs, interruptible motion, velocity handoff, and momentum projection—into concrete web techniques for building and reviewing gesture-driven UI.

antigravity Skill

Apply named StyleSeed motion to React components using framer-motion, with personality seeds and keyword moves from a motion library.

greensock Skill

Animate DOM and SVG elements with GSAP's core engine: tweens, easing, staggers, transforms, and responsive matchMedia.

greensock Skill

Animates Vue, Nuxt, Svelte, and SvelteKit components with GSAP, handling lifecycle hooks, scoped selectors, and cleanup on unmount.

vercel-labs Bundle

Add smooth, native-feeling page transitions and animations to React apps using the browser's View Transition API, with support for shared elements, enter/exit animations, and directional navigation.

jakubantalik Bundle

Provides portable CSS transitions for common UI patterns like dropdowns, modals, tooltips, and skeleton loaders. Each transition is a drop-in snippet with semantic CSS custom properties and a prefers-reduced-motion guard.

heygen Bundle

Creates, edits, and renders videos and animations from HTML compositions using the HyperFrames framework, handling project state, input adaptation, and workflow routing.

heygen Bundle

Provides atomic motion rules, multi-phase scene blueprints, scene transitions, motion-design techniques, and runtime adapters (GSAP, Lottie, Three.js, Anime.js, CSS, WAAPI, TypeGPU) for composing animations with HyperFrames.

nexu-io Bundle

Creates a hero frame with looping CSS animations including a rotating type ring, animated globe, ticking timer, and parallax labels.

nexu-io Bundle

Creates Apple-style soft UI prototypes with squircle cards, spring motion, and ambient mesh backgrounds.

nexu-io Bundle

Generates a video outro frame with a logo assembled from geometric blocks, glow bloom animation, tagline reveal, and CTA, using pure CSS/SVG.

nexu-io Bundle

Generates a single-file HTML page with a cyberpunk glitch-art title frame, featuring chromatic aberration, scanlines, noise grain, and data-corruption animations.

nexu-io Bundle

Creates a 1920×1080 presentation deck with React-like component layout, strict typography and color constraints, and no template restrictions.

ecnu-icalk Bundle

Provides domain-specific guidance for building videos with Remotion, covering captions, FFmpeg operations, audio visualization, and a wide range of composition techniques.

joshuashepherd Skill

Add scroll animations, micro-interactions, or page transitions to a component using GSAP, with reduced-motion support and performance best practices.

adobe Bundle

Render a proposed redesign of a page as a self-contained static HTML file, then iterate via chat-driven commands until approved.

heygen Bundle

Port an existing Remotion (React) composition's source to HyperFrames HTML. Use only on explicit requests to migrate from Remotion; for new compositions or uncertainty, use the general HyperFrames skill.

ecnu-icalk Bundle

Builds distinctive, production-grade frontend interfaces with bold aesthetics, avoiding generic AI design patterns.

joshuashepherd Bundle

Creates programmatic videos with React using Remotion, covering compositions, animations, motion graphics, and MP4 rendering, plus walkthrough and content-to-animation workflows.

auto-skiller Bundle

Provides domain-specific best practices for creating videos with Remotion in React, covering 3D, animations, audio, captions, charts, transitions, and more.

mhassan0000 Skill

Implements accessible, performant UI motion for React and Next.js apps, covering tokens, patterns, and modal behavior.

emilkowalski Skill

Provides design engineering guidance focused on animation principles, UI review, and interface craftsmanship.

emilkowalski Skill

Translates Apple's fluid interface design principles—spring animations, direct manipulation, interruptibility, and velocity handoff—into web implementations using CSS, Pointer Events, and spring libraries like Motion/Framer Motion.