Krumm, a motion studio website template for Claude Code
A one-page site for motion, identity and film-title studios, and for small agencies whose own site should move like their work. The studio name is set in giant type that bends as you scroll. Claude Code installs it in your Next.js project and rebrands it with your name, photos and copy.
Sign in with Google to copy it. Your first item is free, then Solo is €9.99 a month, excl. VAT.
Type that bends
The studio name sits on a cylinder and turns letter by letter with the scroll. On phones it reflows into four shorter rows.
Work on a drum
Projects roll past as you scroll. The active row opens with its image and details, and tags filter the list.
An index you can sort
Every project in one table, sorted by year, name or discipline. On phones it folds into a two-line list.
Calm when asked
With reduced motion on, the type stays flat and the moving details stop, so the page still reads well.
What is on the page
- Header
- Section links, local time and coordinates. It switches between light and dark with the section under it.
- Hero
- The bending studio name, with a portrait sliding up through the type.
- Statement
- Studio facts beside a large paragraph whose words light up as you read.
- Work
- The scroll-driven project drum with tag filters.
- Services
- Six services as an accordion, each with its items and a typical timeline.
- Numbers and clients
- Statistics that count up, a turning badge and a client list.
- The studio
- A team photograph, a short story, the team list and a hiring link.
- Project index
- The sortable table of all projects, with rows that expand.
- Contact
- A brief form and a footer newsletter field. Both are demos that send nothing until you connect them to your own service.
- Three bands
- Short call-to-action bands between the sections, with headlines that roll and bend.
How you install it
- Press Copy prompt, or connect pastetaste to Claude.
- Paste it into Claude Code inside a Next.js project.
- Claude Code installs the site and checks that it runs.
- Answer its short list of questions and it rebrands the site.
What Claude Code asks you
- Your business name, a one-line description, the language and who the visitors are
- Your logo, or whether to keep a text wordmark
- Your photos, and which one goes where
- Your copy, or a few sentences it can write from
- Your brand colours and fonts, if you want them changed
What it is built with
- Next.js 15 or newer, React 19, TypeScript
- Its own scoped stylesheet, so Tailwind is not required
- One font family, Archivo
- No WebGL, environment variables or API routes
- 8 demo photographs you can replace
- Colours and easings in one tokens file
A social pack comes with it
12 posts in the same style as the site: 6 static posts and 6 reels. Claude Code rebrands them and renders the files on your machine.
