scroll-world

An agent skill that generates a scroll-driven 3D-style world landing page for a brand.

Stars: 10.7k
Forks: 1.2k
Licence: MIT
Language: JavaScript
Last update: 3 months ago
Type: AI model / agent

What it is

scroll-world is a skill for AI coding agents such as Claude Code and Codex. It guides the agent through making a landing page where scrolling moves a camera through a connected set of generated isometric scenes, flying from outside each scene into its interior without cuts. The art and camera clips are produced with AI image and video models, and a vanilla JavaScript scroll engine plays them back in a regular web page.

Generate a scroll-through landing page for a logistics, retail, or other industry brand
Produce isometric diorama scenes and camera flight clips for each section of a site
Add a portrait 9:16 mobile chain alongside the desktop version
Drop the vanilla JavaScript scroll engine into a plain HTML, Next.js, Vue, or Python-served page

Great for

Developers who want an immersive scroll-through landing page for a product or brand
Marketers or designers prototyping a visually striking homepage concept
Teams already using Claude Code or Codex who want a repeatable workflow for this style
People comfortable paying for AI image and video generation per project

Not ideal for

Anyone who needs a lightweight, low-cost page; asset generation costs money through Monid or Higgsfield credits, and the README gives a rough example of about $27 for a 6-scene 1080p chain
Teams without access to the Monid or Higgsfield services, since the README lists them as requirements
Users who want a finished template with no generation step, because the generated .mp4 and .webp assets are not shipped in the repo

Step-by-step guide: how to use scroll-worldInstall, first run, examples, tips and FAQs

How to get it

1
Install with a package manager
You'll need: Claude Code or Codex, or another SKILL.md-compatible agent · Monid CLI with API key and balance, or Higgsfield CLI with credits · ffmpeg and ffprobe · Python 3 with Pillow
Install via Vercel skills CLI (Codex or other agents)
npx skills add oso95/scroll-world
Target Codex directly
npx skills add oso95/scroll-world -a codex
Manual clone
git clone https://github.com/oso95/scroll-world
2
Run it
- Install the skill using one of the install commands for your agent.
- In Claude Code, run /scroll-world or ask for a scroll-through world landing page; in Codex, use $scroll-world.
- Answer the intake questions about the brand, scenes, art direction, and budget, then approve the estimated cost.
- Let the skill generate the stills and video clips, then use the scroll engine to wire them into your page.
3
Get the most out of it
- Provide a brand kit URL or specification at intake so the art direction matches your brand
- Use the optional mobile version to get a portrait chain composed for phones rather than a cropped desktop film
- Use the Codex CLI image_gen option for scene stills if you have a ChatGPT subscription, to reduce Higgsfield credit use
- Check the per-run cost estimate before approving generation

Downloads

Source code (.zip)main branch · straight from GitHub

Strengths

Framework-agnostic: the scroll engine works in plain HTML and several common stacks
Seamless transitions are built in, with connector clips generated from neighbouring frames
MIT licensed and open source, with an install path for several agents

Trade-offs

Depends on paid third-party services (Monid, Higgsfield) and a Codex CLI option, so ongoing cost and account setup are required
Generation takes a while and runs in the background, and the README does not give a detailed cost model beyond examples
The README is truncated and does not fully document configuration or troubleshooting

Stats synced from GitHub. The assessment above was drafted with AI from the project's README on 2026-10-29 and may miss recent changes — check the README before relying on a command. MIT licence: free to use, modify and distribute, including commercially, as long as you keep the copyright notice.