SmoothUI

A component that animates the transition of numbers, showcasing smooth animations for incrementing and decrementing values.

A reusable Dynamic Island component inspired by Apple's design, featuring smooth state transitions and animations.

A reusable card component that displays a matrix rain effect on hover, combining smooth animations with canvas-based effects.

This component is an interactive button that visually changes state when clicked. The states are 'idle', 'loading', and 'success', represented by animated icons. When clicked, the button transitions from idle to loading and then to success, using smooth animations.

Component that displays a user's avatar and allows the user to edit their profile information and order history.

Inspired by the power off animation of iPhones, this component allows the user to slide to power off the device.

Starter Mac

4 Applications

Inspired by Family.co and the example by Jenson Wong, this component presents a stack of apps, allowing users to open the stack, select the apps they want, and download them.

ResetSelect

Art Gallery

Select images by clicking on them, delete selected images using the trash icon, and reset the gallery with the refresh button. Inspired by the smooth and intuitive photo gallery experience of iPhones, this interface features seamless animations for an engaging user experience.

Component that morphs a fluid shape into another fluid shape

Component that displays tags with an animation when they are added or removed from the list of selected tags

Connect

Component that displays the metadata information of an image, uses useMeasure to get the size of the information box and move the image on the Y axis

Job listing component with animation when showing more information