morphing-icons
✓Build icon components where any icon morphs into any other through SVG line transformation. Use when asked to "create morphing icons", "build icon transitions", "animate between icons", or "transform icons".
Installation
SKILL.md
Build icons that transform through actual shape transformation, not crossfades. Any icon can morph into any other because they share the same underlying 3-line structure.
Every icon is composed of exactly three SVG lines. Icons that need fewer lines collapse the extras to invisible center points. This constraint enables seamless morphing between any two icons.
Icons needing fewer than 3 lines use collapsed lines—zero-length lines at the center:
Build icon components where any icon morphs into any other through SVG line transformation. Use when asked to "create morphing icons", "build icon transitions", "animate between icons", or "transform icons". Source: raphaelsalaja/userinterface-wiki.
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/raphaelsalaja/userinterface-wiki --skill morphing-icons- Category
- </>Dev Tools
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is morphing-icons?
Build icon components where any icon morphs into any other through SVG line transformation. Use when asked to "create morphing icons", "build icon transitions", "animate between icons", or "transform icons". Source: raphaelsalaja/userinterface-wiki.
How do I install morphing-icons?
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/raphaelsalaja/userinterface-wiki --skill morphing-icons Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor
Where is the source repository?
https://github.com/raphaelsalaja/userinterface-wiki
Details
- Category
- </>Dev Tools
- Source
- skills.sh
- First Seen
- 2026-02-01