Skip to content
Founding Lifetime: every Pro skillfirst 100 members · $199 onceUpgrade
Lookbk
Sign In
Open live demo

The page this skill built from examples/swell, working in your browser. Opens in a new tab.

5-second example rendered by this skill from examples/swell · 1280×720

What you get

  • A one-page hero and a paste-in embed with your name, words, numbers and links
  • Words laid over the film (in this one nothing is cut out: the van is too big for a clean matte)
  • The intro animation tied to the film's own clock, so words and picture stay in step
  • A phone layout: the headline stays in the frame, the introduction and buttons move into a block underneath
  • Stills of the last frame for reduced motion, no WebGL, blocked autoplay or a slow connection, so it is never blank
  • A 1080p MP4 with the film's sound and a poster, rendered frame by frame
  • Checks at 390, 768, 1280 and 1920 px for overflow, overlaps, links and script errors
  • Open-source licenses for every part it builds on

Good fit

  • Surf, travel and outdoor brands can open on a cream camper van with surfboards on the roof and a golden retriever in sunglasses at sunset.
  • Apps with a report to show, such as surf conditions, can fill a ticket with up to four label and value pairs and a one-word verdict.
  • Teams that want big, friendly type can set a three-line script headline with four stacked stripe shadows, laid over the picture.

Not for

  • Swapping in your own video: the matte is made for this film, and the scene (a surf van with a golden retriever at sunset) is the design
  • Changing the colors, fonts or layout through settings (every word, number and link is yours; the look is fixed)
  • Long headlines: each field has a length limit the build enforces
  • Sound on the live page (browsers only autoplay muted video; the MP4 keeps the sound)
  • Full landing pages below the hero (see the Landing Pages series)

About this skill

A website hero on five seconds of generated footage: a cream camper van with surfboards on the roof waits by the palms at sunset while a golden retriever in sunglasses leans out of the window, tongue out, and the camera pushes in on the dog. A chunky 1970s headline with stacked orange shadows sits over the picture. Around it: a sunset logo, a pill navigation, a round surf-report badge and a ticket-style surf report. Your agent writes one hero.json with your words and links; the build checks every length and writes a page and an embed, and a recorder makes a 1080p MP4 with sound.

Example request

Make a Surf Van hero for our surf-forecast app with our name, headline, report fields and buttons, and record the video.

Similar Skills

View all
New
web
Bowling Otter HeroClaude CodeCodexCursor+3 more agents
New
web
Coast Convertible HeroClaude CodeCodexCursor+3 more agents

Details

Output
Retro hero on generated footage · words behind the subject · page + embed · 1080p MP4 with sound
Needs
Node.js 18+, Chrome, and ffmpeg for the video; the page needs a web server (a local one is included)
Series
Footage Heroes · 17 skills
Updated
Oct 26, 2026
Checked
Oct 26, 2026: its own commands ran and passed. That is a working check, not a security audit.

Installed it? Tell others how it went. Reviews come from people who installed this skill.

Write a review

FAQ

Why does the headline sit over the van instead of behind it?

The van is too big for a clean matte, so nothing is cut out of this film and the words are laid over the picture. The headline covers part of the van and the dog’s window while it is there. That is the design, and no setting changes it.

What happens on a phone?

Under 760 px a bar with the name and main button sits above the frame, the frame keeps the headline and the sticker, and the introduction and buttons move into a block underneath. The links, ticket and footer are left out, because they are too small to read at that size.

How long can the words be?

The top line takes up to 11 characters and the two giant words up to 5 characters each, punctuation included. Short, round words read best; wide letters like M and W run out of room sooner. The wordmark takes up to 9 characters.

Which agents is Surf Van Hero written for?

Any agent that reads SKILL.md folders, including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI and OpenCode.

Do I own what I make with it?

Yes. Everything your agent makes with this skill is yours, including for client and commercial work.

What if it doesn’t work for me?

Email support@lookbk.dev within 7 days of buying and we’ll fix it or refund you.

Credits and licensesBuilt on greensock/GSAP

What Lookbk adds on top of greensock/GSAP (Standard License): the footage, which was generated for Lookbk (a still image animated into film), and the layout, template and Footage Heroes kit, all written for Lookbk. GSAP (free under its Standard License) loads from a pinned CDN with SRI; the fonts are from Google Fonts.

Credits and licenses for the open-source software and fonts it uses are in NOTICE.md inside the download.