4-second example rendered by this skill from examples/torvane-trace · 1280×720
Example settingswhat each example above was built from
examples/torvane-tracebrief.json
- Name
- Torvane
- Format
- wide
- Style
- trace
- Tempo (BPM)
- 132
- Colors
- ground #0b0d10 · ink #eceff2 · accent #7ef0c6
examples/hollin-liquidbrief.json
- Name
- Hollin & Crumb
- Format
- wide
- Style
- liquid
- Tempo (BPM)
- 108
- Colors
- ground #f4ece0 · ink #2b1a12 · accent #c4552d
What you get
- A 3.4 to 5.3 second MP4 logo sting at 1920×1080 or 1080×1080 with its own music
- A two-bar soundtrack whose final hit, an impact with a sub drop and shimmer, lands on the frame the logo resolves
- Three reveal styles drawn from the logo itself: line trace, shard assembly and liquid mask
- Hairline rings, a light flare on the hit, a specular sweep across the mark, and a one-move exit (push-in, then a clean cut)
- A wordmark and tagline in one of three type pairings, stacked or inline
- cues.csv with every beat in seconds, timecode and frames, and the option to use your own sound
- A brief checker and a render script that checks the music's loudness, peaks and timing
- Open-source licenses for every part it builds on
Good fit
- A channel or podcast wants a branded intro that opens every episode on the same beat.
- A product team needs an end card that holds the logo and tagline after a launch video.
- A studio delivering brand assets wants matching widescreen and square stings from one brief.
Not for
- Logos that only exist as PNG or JPEG
- Long animated explainers or product demos
- 3D logo renders with materials and lighting
- Vocals or a licensed song, since the music is synthesised
About this skill
Logo Sting turns a brand's SVG logo into a short ident for the start or end of a video, with its own original music. A two-bar soundtrack generated on your machine builds for one bar, and the logo resolves exactly on its final hit, a chord and impact that ring out under the lockup. You pick one of three reveals drawn from the logo's own paths: a line trace with a pen point and a soft bloom, a shard assembly where about 50 triangles snap together, or a liquid mask that opens and leaves the logo behind. Hairline rings ripple and a light flares on the hit, a specular sweep runs across the mark, then the name and tagline land and the whole lockup leaves in one move (a push-in and a one-frame cut) or holds.
Example request
Make a 5 second logo sting for the start of our videos from logo.svg: trace the logo line by line, then the name Torvane and the tagline "Edge compute for real-time systems", dark ground, mint accent, 16:9 and a square version.
How it works
Your agent
- 1
Get the logo
Ask for the logo as an SVG.
- 2
Write the brief
Create
brief.jsonnext to the logo. - 3
Apply the brief
It checks the whole brief and lists every problem at once.
- 4
Check
It opens the project in headless Chrome, plays the timeline to each moment where type has settled (the lockup settled, and the last frame (or the frame before the exit)), and fails (exit 1, every problem listed) when any visible text has capitals under 3% of the frame height, leaves the safe area (the 90% title-safe area), or is faded in or out by opacity for longer than 6 frames (use a mask or a hard cut instead).
- 5
Look before you render
Run the
snapshotcommandapply-briefprinted. - 6
Render, with the music
It renders the picture with HyperFrames (
--quality delivery), puts the track under it withscripts/music/mux.mjs(AAC, trimmed to the film, at the brief'smusic.volume), checks the track against its beat map and stems withscripts/music/check.mjs(loudness, peaks, spectrum, every kick on time, and the SFX checks A1 to A11) and checks that the MP4 has a video and an audio stream of the same length. - 7
Sound
The film ships with its own soundtrack.
- 8
Hand it off
Give the person
renders/logo-sting.mp4(and the square version if they asked for both), one still from step 5, andcues.csvif someone will add sound.
- 1
You get
- renders/logo-sting.mp4


What you need
- Node.js 22 or newer, and FFmpeg (with
ffprobe) on the PATH. - HyperFrames runs through
npx, pinned to the version this template was tested with:npx --yes hyperframes@0.8.192. The first render downloads a headless Chrome. Ifrendersays Chrome is missing, runnpx --yes hyperframes@0.8.192 browser ensureonce. - Network access to
cdn.jsdelivr.net, which serves GSAP to the template. See Troubleshooting if it is blocked. - The brand's logo as an SVG with outlined paths. The music is made on your machine by
scripts/music/(plain Node.js); bring your own sound only if you want one instead (step 7).
Last checked Nov 1, 2026: the package’s own build and render commands ran and passed.
If something goes wrong
Render hangs, then shows a static frame, or reports
sub_timeline_script_failure.GSAP didn't load. If your network blocks
cdn.jsdelivr.net, runnpm i gsap@3.14.2in the project, copynode_modules/gsap/dist/gsap.min.jstoassets/vendor/, and point the<script src>inindex.htmlatassets/vendor/gsap.min.js.The logo is invisible or faint after the hit.
Its colours are too close to
ground.apply-briefstops when every colour in the logo is below 1.6:1; between that and about 3:1 it still renders but reads weakly. Set"tint": "ink".The trace skips part of the logo, which then pops in with the fill.
That part is live text, an
<image>or a<use>reference. Outline it in a vector editor and export again.
What’s in the download
- SKILL.md25.0 KB
- examples/
- examples/hollin-liquid/1.33 KBa made-up bakery; warm and light, 16:9, liquid mask, 108 bpm,
warm-housemusic, holds to the last frame. The previews on Lookbk are rendered from these two. · 2 files - examples/torvane-trace/1000 Ba made-up edge-compute company; dark, 16:9, line trace, 132 bpm,
launch-pulsemusic, clears at the end. · 2 files - scripts/
- scripts/music/beatgen, the music generator, with its own README.
- scripts/music/examples/
- scripts/music/examples/events.example.json555 B
- scripts/music/samples/
- scripts/music/samples/manifest.json371 B
- scripts/music/beatgen.mjs11.8 KB
- scripts/music/check.mjs50.0 KB
- scripts/music/dsp.mjs20.0 KB
- scripts/music/engine.mjs51.7 KB
- scripts/music/mux.mjs2.36 KB
- scripts/music/presets.mjs36.8 KB
- scripts/music/README.md23.7 KB
- scripts/music/samples.mjs4.90 KB
- scripts/music/sfx.mjs17.1 KB
- scripts/music/theory.mjs3.34 KB
- scripts/music/voices.mjs16.9 KB
- scripts/apply-brief.mjs17.7 KBchecks a brief, cleans the logo, makes the music, writes the config, the canvas size, the length and any sound clip, and writes
cues.csv. No dependencies. - scripts/gate.mjs15.3 KBthe type gate (cap height, safe area, no long text fades), run by
render.mjsbefore it renders. - scripts/music.mjs16.0 KBreads the
musicblock and builds the beat grid. - scripts/render.mjs9.00 KBruns the type gate, renders, puts the music under the picture and checks the result.
- template/the HyperFrames project.
- template/hyperframes.json318 B
- template/index.html8.15 KBholds the stage and the type styles.
- template/package.json288 B
- template/sting.config.js1.19 KBis the brief, as written by
apply-brief.mjs. - template/sting.js35.5 KBdraws the chosen style from the logo and builds the timeline.
- NOTICE.md1.36 KBthird-party software this skill uses.
- PROMPT.md2.65 KBa prompt to paste into Claude Code or Codex to make a film for your own brand with this skill.
- TESTED.json5.67 KB
30 files · 380 KB · installs to ~/.claude/skills/logo-sting for Claude Code and ~/.agents/skills/logo-sting for other agents
Credits and licenses: NOTICE.md plus any LICENSE files inside the ZIP.
Similar Skills
View allDetails
- Output
- MP4 · 3.4–5.3 s · 1080p or 1080×1080
- Needs
- Node.js 22+, FFmpeg and Chrome (HyperFrames fetches its own headless Chrome on the first render), plus the brand's logo as an SVG with outlined paths.
- Series
- Motion Type · 5 skills
- Updated
- Nov 2, 2026
- Checked
- Nov 1, 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
Does the sting come with sound?
Yes. It makes its own two-bar track in one of six styles, and the logo resolves exactly on the final hit, read from the track's beat map. To use your own file instead, turn the music off and give the file and the time of its peak, and it is placed one frame after the hit.
Which reveal style suits which logo?
Line trace suits marks built from a few clean paths, such as rings, blades or letterforms. Shard assembly works with any logo, including detailed ones, and has the loudest hit. Liquid mask suits compact marks and warmer brands, since a very wide logo makes a very large blob.
Can I get a widescreen and a square version?
Yes. Set format to wide for 1920×1080 or square for 1080×1080, apply the brief and render, then switch the format and render again. The lockup is laid out for each frame, and a long name in the square frame should use the stacked lockup.
Which agents is Logo Sting 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 heygen-com/hyperframes
What Lookbk adds on top of heygen-com/hyperframes (Apache-2.0): Lookbk wrote this package, including its music generator, on HyperFrames (Apache-2.0) with GSAP (Standard License), using the Inter, EB Garamond and JetBrains Mono fonts (SIL Open Font License 1.1) that HyperFrames bundles.
Credits and licenses for the open-source software and fonts it uses are in NOTICE.md inside the download.