025Randomize & Focus

Maybe my favorite effect in our collection: as the mouse moves, we’ll navigate through a set of cards, highlighting the one closest to the cursor while the others move away. I love the smooth and bouncy feel of the effect—it creates a natural movement, almost like running your hand over them. Let’s dive in and see how it’s done!

HTML Structure

The structure is simple: each card is contained within a div called container.

<div class="container">
    <div class="card">
        <div class="content">
            // Content of the card
        </div>
    </div>
    <div class="card">
        <div class="content">
            // Content of the card
        </div>
    </div>
    ...
</div>

Become a member to unlock
the full effect
today.

Join now Join now

Get started with free effects

Get a taste of what’s possible with Made With Gsap, completely free

Try it now Try it now

No credit card or account required.
Free for everyone.