FreeVideo
App window with zoom
- 365365 downloads
- 125125 likes
- 188188 saves
Works with
+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
Logo animation: draw-on, reveal, morph v1.0.0
Use this resource to animate a logo for a website, a video or a splash screen
New
- 508 downloads
- 118 likes
- 150 saves
Free
Install with the CLI
In a terminal, from the folder you want:
npx --yes palatekit@latest install logo-animationWith no option, the skill goes to ~/.agents/skills/; add --agent claude-code (or codex, cursor…) to target an agent.
First time: connect the CLI with
npx --yes palatekit@latest loginThe agent picks one technique that suits your mark (stroke draw-on, mask reveal, staggered build, morph, idle loop), keeps its geometry and clearspace intact, and ships a standalone HTML file with a static end frame. If you have a sound logo, it lands the settle on the audio peak, then checks the result frame by frame. You get a short brand reveal of 0.8 to 2.5 seconds.
Mostly picked by
Updated November 2, 2026
Previews
Details
- Install guides
- Generates with
- Your agent's model
- Uses
- GSAP or dotLottie, depending on the technique (optional)
- Licence
- MIT
Similar resources
View all- Free
FreeVideo
One big number
- 463463 downloads
- 223223 likes
- 100100 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
PalateKit Motion, the library
- 338338 downloads
- 198198 likes
- 249249 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Three bars head to head
- 348348 downloads
- 133133 likes
- 182182 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Before / after slider
- 322322 downloads
- 248248 likes
- 238238 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Three-card carousel
- 418418 downloads
- 157157 likes
- 101101 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Chat exchange
- 564564 downloads
- 127127 likes
- 161161 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
PROVideo
Checklist ticking off
- 442442 downloads
- 233233 likes
- 160160 saves
Works with+ HyperFrames- Claude Code
- Codex
- Cursor
- and 3 more
What you get
- SKILL.md: principles, technique map, sound-logo sync, delivery targets and verification
- references/logo-patterns.md: code for every technique, timing tables and clearspace rules
- A standalone HTML template that freezes any moment for review
- A pre-delivery checklist
Good fit for
- Intro or sign-off for a brand video
- Logo reveal in a landing-page hero
- App splash screen or loading animation
Not for
- Redesigning the logo itself
- Long multi-scene motion pieces
Tags
- logo
- animation
- svg
- lottie
- branding
About
You say
"Animate our SVG logo: the outline draws itself, then the name appears, in under two seconds."
Skill published by iart-ai under the MIT license.
Show moreShow less
Prerequisites
- You bring
- The logo as SVG and The brand's sound logo, if any
- Dependencies
- GSAP or dotLottie, depending on the technique (optional)
How to use it
- Provide the logo as SVG, plus the sound logo if there is one
- Name the effect and the target: website, video or app
- Review the start, middle and end frames, then sign off
Content preview
Files
- LICENSE1.1 KB
- NOTICE-PALATEKIT.md0.4 KB
- references/logo-patterns.md8.1 KB
- SKILL.md8 KB
Origin and licence
Modified by PalateKit
- Author
- iart-ai
- Source
- github.com/iart-ai/motion-design-skills/tree/3c129f769d90a1328c209c386492333c9ac62312/skills/logo-animation
- Licence
- MIT
Notice
Version modifiée de « logo-animation » (iart-ai, MIT) : traduction française et fiche par PalateKit.
User reviews
–
No ratings yet
Loading reviews…
Frequently asked questions
Are the helper scripts mentioned in the skill included?
No, the original repository's scripts/ folder is not shipped. Verification works with the Playwright command given in the skill, or by opening the file with ?t=… in a browser.
My logo is a PNG. Is that a problem?
Draw-on and morph need an SVG. With a PNG, the agent sticks to fades, scaling and masks.