The page this skill built from examples/studio, working in your browser. Opens in a new tab.
13-second example rendered by this skill from examples/studio · 1280×720
What you get
- A self-contained page with the divider between two text sections, in your colors and words
- Six seamless loops (moth, orb, lotus, branch, jelly, prism) and a poster for each
- A reduced-motion still and a fallback when autoplay is blocked, so the band is never empty
- A checker that measures the black edges and the loop seam, and a page check for the video attributes and text alternative
- A script that turns your own object-on-black clip into a seamless, size-limited loop
- Open-source licenses for every part it builds on
Good fit
- Dark landing pages can break between the hero and pricing with a calm lit object that floats in the page instead of a stock divider line.
- Studios and product sites get a distinct centre piece from six original loops, each about half a megabyte, without writing any animation code.
- Anyone with their own object on a black background can turn the clip into a seamless loop that melts into the page.
Not for
- Light backgrounds: the blend only adds light, so the page needs to be black or very dark
- Making new objects for you (the six shipped loops are the library; for your own, bring a clip on pure black)
- Sound, controls or clips longer than about 10 seconds
- Full landing pages around the divider
About this skill
A band between two sections of a dark page with one lit object floating in it: a glass moth opening its wings, a liquid-chrome orb with a turning ring of light, a folded-paper lotus, a moss branch, a neon jellyfish, a prism shard. Each is a short 1080p loop on pure black, laid on the page with mix-blend-mode screen so the video's black becomes the page's black and only the light stays: no box, no frame. Six original loops ship in the package, about half a megabyte each. Your agent writes one divider.json with your page colors and words, builds the page, and checks that the edges are black and the loop does not jump. A still poster shows for reduced motion and when autoplay is blocked. A script turns your own clip of an object on black into a seamless loop.
Example request
Put a Black Plate divider between the hero and the pricing section of our dark landing page, using the glass moth loop, with our background color and a short line above and below.
How it works
Your agent
- 1
Pick the loop
Ship one of the six in
<skill>/footage/(each has a matching.webpposter), or make your own in step 5. - 2
Write divider.json
Copy
<skill>/examples/studio/divider.jsonand change the words. - 3
Build
It writes
out/index.html,out/loop.mp4andout/poster.webp. - 4
Check
The clip check reads the outer 12% on each side (brightest pixel must be 40 or less out of 255), compares the last frame with the first (a loop that jumps fails), and fails a file over 4 MB or a clip that is not wide.
- 5
Your own object (optional)
It cuts a 4-second body and fades its last second into the clip's first second, so the loop is seamless; on a black background the cross-fade can't be seen.
- 6
Look at it
Open
out/index.htmlin a browser at desktop and phone width.
- 1
You get
- out/index.html
- out/loop.mp4
- out/poster.webp


What you need
- Node.js 18 or newer. Nothing to install.
- ffmpeg, for
check.mjsandmake-loop.mjs(brew install ffmpeg,winget install ffmpeg,apt install ffmpeg; or setFFMPEG_PATH). - A dark site. The effect needs a background that is black or a very dark colour.
- Optionally your own clip: a single lit object on pure black
#000000, in the middle third of a 16:9 frame, moving gently, 4 to 10 seconds, from any video generator or 3D tool.
Last checked Oct 27, 2026: the package’s own build and render commands ran and passed.
If something goes wrong
A faint rectangle shows around the video
The clip's black is lifted (dark grey) or the page's background is lighter than the clip.
check.mjsreports the brightest edge pixel; over 40 means re-render the clip on#000000, or darken the page background to match.The loop jumps when it restarts
The first and last frames differ. Run the clip through
make-loop.mjs; the check prints how far apart they are.The object is cut off on phones
The video fills the band with
object-fit: cover, so a narrow screen crops the sides. Keep the object in the middle third of the frame, or raiseheight.
What’s in the download
- SKILL.md7.10 KB
- examples/
- examples/studio/883 B1 file
- scripts/
- scripts/build.mjs4.97 KBwrites the page, the loop and the poster from a divider.json.
- scripts/check.mjs4.65 KBchecks a clip (black edges, seam, weight) or a built page.
- scripts/make-loop.mjs2.61 KBturns your clip into a seamless, size-limited loop.
- NOTICE.md1.05 KBwhere the loops come from and their terms.
- TESTED.json568 B
7 files · 21.8 KB · installs to ~/.claude/skills/black-plate-dividers for Claude Code and ~/.agents/skills/black-plate-dividers for other agents
Credits and licenses: NOTICE.md plus any LICENSE files inside the ZIP.
Similar Skills
View allDetails
- Output
- Looping object dividers · page + 6 loops · 1080p on pure black
- Needs
- Node.js 18+, ffmpeg, and a dark website; your own clip is optional
- Series
- Motion Heroes · 51 skills
- Updated
- Oct 28, 2026
- Checked
- Oct 27, 2026: its own commands ran and passed. That is a working check, not a security audit.
Written for
See all 31 agents that read skill folders.
Install guides
For your agent
Generates with
Installed it? Tell others how it went. Reviews come from people who installed this skill.
Write a reviewFAQ
Why does the video have no box around it?
The loop's background is pure black and it is laid on the page with mix-blend-mode screen, which only adds light. Where the video is black the page shows through. That is why the page needs to be black or a very dark color.
Can I use my own object?
Yes. Make a clip of one lit object on pure black, wide, with empty black on both sides, and run make-loop.mjs on it. It fades the last second into the first so the loop is seamless, fits the file under 3 MB, and check.mjs then confirms the edges are black.
What if the video does not play?
A still poster of the same frame shows for visitors who ask for reduced motion and when a phone blocks autoplay, so the band is never empty. The video is muted and plays inline, and it pauses when scrolled out of view.
Which agents is Black Plate Dividers 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 licensesWritten by Lookbk
Lookbk made this package: the six loops were generated for Lookbk from its own original stills (invented objects, no people, logos or text), and the builder, checker, loop script and page are original. No third-party code or fonts are included. Written by Lookbk, no third-party code.
Credits and licenses for the open-source software and fonts it uses are in NOTICE.md inside the download.