guillermolg00/morphicons

Health v2 · maintenance only

Flags: young

Adoption not part of the score

2036 stars · 50 forks observed · 2026-08-28

What it is AI-extracted, prompt v1, taxonomy v1, 2026-08-30, confidence not recorded

morphicons is a TypeScript library that morphs any stroke-based SVG icon into any other with spring physics, using closed-form 2D Procrustes alignment so rotations emerge automatically. It ships framework bindings for React, Vue, Svelte, React Native, Astro, and a custom element, with zero runtime dependencies and a ~6.5 KB gzipped core.

Use cases

• animate a menu icon morphing into a close icon on toggle
• morph between any two Lucide, Tabler, or Heroicons icons
• add spring-based icon transitions to a React or Vue app
• use animated icons in React Native with react-native-svg
• render morphing icons as a framework-agnostic web component
• build icon transition animations without hand-declaring rotation groups

When to choose

• you need smooth icon-to-icon morph animations with spring physics
• you want a tiny, dependency-free animation library
• you use multiple stroke icon sets and want them to interoperate
• you want rotations computed automatically rather than configured by hand
• you need the same morphing behavior across React, Vue, Svelte, React Native, or plain JS

When to avoid

• you need to morph filled or complex multi-path icons rather than stroke-based ones
• you only need static icons with no animation
• you need color or fill interpolation, not just stroke path morphing
• your project requires CommonJS rather than ESM

Facets

library · maturity active

animation ui-components frontend-framework frontend web-development graphics browser cross-platform svg icons morphing spring-physics react vue svelte react-native astro web-component typescript zero-dependencies lucide tabler heroicons web-server nodejs

Member repositories

For agents

markdown · JSON · MCP: product_card(name="guillermolg00/morphicons")