BenDay
Turn your logo into an animated dot-based loading indicator with 21 presets, a playground and an open-source React component.
About this resource
Three lines become a cross. A right arrow turns down. These tiny moments are easy to overlook in a mockup, but they make a working interface feel less abrupt. Morphicons is a library built for exactly this sort of transition. It can take icons from Lucide, Tabler or Heroicons and calculate the in-between drawing. Where a shape only needs to rotate, it rotates. Where the outlines differ, it changes their form. You can test the result on the website by choosing two icons and playing with the animation. For a developer, the setup is fairly small: install the package through npm, then use it in React, Vue, Svelte, Astro, React Native or regular JavaScript. It's available under an open-source license and doesn't depend on other runtime packages.
Usage and licensing
Morphicons uses the MIT license. Its demo includes icons from other libraries; their own licenses still apply.
Check the creator’s current terms before using this resource.Similar resources
Cursor Lab — Custom Web Cursors
A free workbench with 28 custom web cursors, live parameter controls, and copyable JavaScript, React, and CSS code.
Movin Easings – Animation Curve Editor
An easing gallery with a cubic-bezier editor, motion previews and code examples for web animation.