Pixel Motion Button — Interactive Button for Framer
A button that reacts. Pixels light up under the cursor and fade away.
Most buttons just sit there until clicked. Pixel Motion Button comes alive the moment a cursor gets close: tiny pixel blocks flash to life under the pointer in three colors, then quietly fade back into the surface. It's the kind of micro-interaction that makes a page feel crafted — and makes people want to click.
Why designers pick it
No code, ever. Drop it on the canvas and style everything from the properties panel.
A real button. Renders as a semantic <button>, or as a link when you add a URL — with an onTap event and open-in-new-tab option.
Fully yours. Text, font, background, text color, optional stroke, three pixel colors, pixel size, brush radius, fade speed, corner radius and padding.
Never plain. A designed pixel patch renders on the Framer canvas and in thumbnails.
Light and fast. One canvas element, no libraries, touch-friendly.
Pixel Motion Button — Interactive Button for Framer
A button that reacts. Pixels light up under the cursor and fade away.
Most buttons just sit there until clicked. Pixel Motion Button comes alive the moment a cursor gets close: tiny pixel blocks flash to life under the pointer in three colors, then quietly fade back into the surface. It's the kind of micro-interaction that makes a page feel crafted — and makes people want to click.
Why designers pick it
No code, ever. Drop it on the canvas and style everything from the properties panel.
A real button. Renders as a semantic <button>, or as a link when you add a URL — with an onTap event and open-in-new-tab option.
Fully yours. Text, font, background, text color, optional stroke, three pixel colors, pixel size, brush radius, fade speed, corner radius and padding.
Never plain. A designed pixel patch renders on the Framer canvas and in thumbnails.
Light and fast. One canvas element, no libraries, touch-friendly.
