Projects 12 block design & features
The block displays six project cards in a responsive grid that transitions from one column on mobile to three on desktop. Each card contains a rounded image, followed by the project title, year, and category type below. A section heading sits above the grid.
When the cursor enters any card, a floating tooltip element appears and tracks mouse position with spring-damped physics, creating a smooth trailing motion. The tooltip contains an "Explore" label with an animated arrow inside a frosted-glass pill. Images brighten and scale subtly on hover while a dark scrim fades in.
The visual language is modern portfolio with rounded corners, generous column gaps, and clean sans-serif metadata. The spring-animated tooltip adds sophistication beyond typical hover states, giving the grid an interactive, almost playful feel.
On small screens the grid stacks to two columns, and the cursor tooltip is effectively a desktop-only enhancement.