Push

The element shrinks slightly while pressed and springs back on release.

Add a "Press (Button Tap Scale)" effect (also called tap feedback or press state) to [where].
While it is pressed the element should shrink slightly and darken a touch, then spring back to full size with a small bounce on release: quick and subtle.
Show the same feedback for keyboard presses and touch, and keep the surrounding layout from shifting.

The element moves downward a few pixels on hover, as if pressed into the page.

Add a "Sink" hover effect to [where].
The element should move down a little and stay there while the pointer is over it, as if pressed into the page, and rise back when it leaves: smooth, with no bounce.
Move it visually without shifting the surrounding layout, and show the same effect on keyboard focus.

The element smoothly scales down slightly when hovered.

Add a "Shrink" hover effect (also called scale down) to [where].
The element should scale down slightly and smoothly while the pointer is over it, and grow back when the pointer leaves: quick and subtle.
Keep the surrounding layout from shifting, and show the same effect on keyboard focus.

A colored circle grows from or shrinks toward the center to fill the element on hover.

Add a "Radial Fill" hover effect (also called circle expand) to [where].
A circle of the new color should grow smoothly from the center until it fills the element, and shrink back to the center when the pointer leaves, while the label color switches to stay readable.
Keep the circle clipped inside the element's shape and the label above it, and show the same effect on keyboard focus.

A rectangle expands or contracts inside the element to change its background on hover.

Add a "Rectangle Fill" hover effect to [where].
The new background color should close in from all four edges as an inner rectangle shrinks toward the center, and open back out when the pointer leaves, while the label color switches to stay readable: smooth and quick.
Keep the label above the fill, and show the same effect on keyboard focus.

The element turns by a few degrees when hovered.

Add a "Rotate" hover effect to [where].
The element should turn slightly clockwise while the pointer is over it and turn back when it leaves: smooth and subtle.
Keep the surrounding layout from shifting, and show the same effect on keyboard focus.