Toast Stack

I built a stacked toasts system similar to ones you see in dashboards. Each toast animates using Framer Motion’s layout transitions so the stack collapses and expands smoothly as items enter or leave.

When the user hovers over the stack, every toast animates back to a flat list by resetting its y-position and scale. When the hover ends, the cards ease back into a layered pile with slight scaling differences to show depth.

Each toast also fades in with a small stagger so the stack feels like it builds upward one piece at a time.