Skip to the content

Library/ 71 pixel-fill-buttonNewProButtons

Pixel Fill Button

A button that fills in square pixels from where the pointer enters.

A Pro component: the live demo and the code come with Pro.

Settings

Pro
  • pixel
  • spread
  • duration
  • icon
Tune it live with Pro

What it does

Pixel Fill Button is an animated button ready for your AI assistant, React or plain JavaScript, with no dependencies. Also called pixel button, pixel dissolve button or 8-bit fill button.

Square pixels light up in a wave from where the pointer enters and empty out from where it leaves; a wave cut short turns back. A tap fills it from the finger, keyboard focus from the centre, and reduced motion keeps a short fade.

With Pro

The AI prompt, the React component, the plain JavaScript file and the embed come with Pro, along with the live demo. Every setting is optional: with none, you get the effect as the preview shows it.