Morphicons
Turn a hamburger menu into a close icon, or one arrow into another, without a hard cut. Morphicons does the SVG animation.
About this resource
BenDay puts your own logo where a loading spinner would normally appear. During a task, the mark becomes a moving field of dots. Once the task finishes, the dots return and the logo is whole again. It can be used as a thinking indicator in an AI interface or for other waiting states. The playground has 21 motion presets by Kacem Mathlouthi. You can watch the dots ripple, sweep or orbit, then choose a movement that fits your design. Developers can write their own animation as well. BenDay is a React component installed through the shadcn registry. Rather than adding another runtime package, installation copies the component's source files into your project. You can then adjust its behaviour yourself. The component supports thinking, idle and done states, and honours reduced-motion preferences. The source is available on GitHub under the MIT license. Trying presets in the playground needs no installation; using them in a live product does require React development.
Usage and licensing
BenDay source code is released under the MIT license. Make sure you have the rights to any third-party logos or images you use.
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.