Scroll Craft

scroll-world is an agent skill for Claude Code, Codex, and other SKILL.md-compatible agents that builds scroll-scrubbed 3D world landing pages for brands and industries. It generates cohesive isometric diorama scenes and image-to-video camera flights, linking scenes through first/last-frame conditioning so the camera appears to move continuously as the visitor scrolls. The skill provides prompt templates, an AI image and video rendering pipeline using Higgsfield, Monid, Seedance, Kling, or Codex image generation, and a framework-agnostic vanilla JavaScript scrubbing engine that can be used with plain HTML, Next.js, Vue, or a Python-served page. It can also render a separate portrait chain for mobile devices and requires external rendering services or CLIs, ffmpeg/ffprobe, and Python with Pillow.

Open 3D Skills is a collection of eight agent skills for building 3D and animated websites with three.js, scroll-scrubbed films, transparent video, cursor-following characters, exploded-view explainers, AI-generated motion assets, browser checks, and frame-exact video recording. Its skills include code-built real-time scenes, generated-clip pipelines with start and end frames, per-frame transparent-video processing for browser playback, pose-grid cursor rigs, staged machine views with labels and picking, and automated Chromium and WebKit checks for frame time, draw calls, errors, blank canvases, overflow, and reduced-motion behavior. The frame-capture skill records pages at 60 fps using a virtual clock and can create comparisons. The repository installs selected or all skills through the `npx skills` CLI, Claude Code, Codex, Cursor, Gemini CLI, OpenCode, or a shell installer; each skill is a plain `SKILL.md` folder that compatible agents can load. The repository's scripts require Node 22.20 or newer, Python 3.9 or newer with Playwright and media-processing libraries, and ffmpeg; some skills also require an image or video generation service. It is licensed under the MIT License.

A Claude Code skill for creating motion-design videos in code using HTML, Playwright, ffmpeg, Python, and Chromium. It computes each frame from a deterministic seek(t) function, renders frames with Playwright, blends subframes for motion blur, and encodes the result with ffmpeg. Its motion system includes closed-form springs, log-space camera keyframes, shared-element handoffs, masked word-by-word text, color floods, and ports of selected 21st.dev components. The workflow moves from inputs and a beat map through still-frame approval, full rendering, pop detection, audio generation, and final muxing. Audio processing finds musical drops by band energy, aligns the song to a key visual frame, places sound effects at measured peaks, and applies two-pass loudness normalization. The repository also includes a remake mode for frame-locked recreations with shot analysis, side-by-side verification, and royalty-free replacement audio. The code is MIT-licensed; downloaded third-party media remains under its respective license.

MotionSites Web Builder is a free Claude skill for creating cinematic landing pages. Claude studies related example designs, selects media from a shelf of hosted videos, 3D cut-outs, and images, writes a detailed build specification, generates the page, then uses screenshots and a QA script to check assets, mobile overflow, fonts, and video playback before applying fixes. The skill includes example prompts, technique recipes for effects such as seamless video loops, liquid glass, word-by-word blur headlines, mouse-scrubbed video, depth carousels, scroll stories, and Three.js models, plus design rules and a specification template. It can be installed in Claude.ai, Claude Desktop, or Claude Code, and can produce prompts for other website-building tools. Its instructions and code are licensed under MIT; the example prompts and media remain under MotionSites copyright.