---
title: "Cursor Origin Button"
url: "https://sanyam.sh/lab/cursor-origin-button"
date: "2025-08-23"
---

# Cursor Origin Button

A button component that follows the cursor's position for its hover effect origin point. The expansion animation originates from wherever your cursor enters the button.

grabbed mouse origin coords on the fly using `ref`, added a buffer to the origin instead of locking to the exact mouse-enter point, used a `::before` pseudo for the animated background scaling from cursor-origin using CSS variables, and set `transform-origin` dynamically to follow mouse position

- Source: https://x.com/sanyampunia/status/1959210575361142944
