Glowing hover button
A call-to-action button wrapped in a breathing glow that brightens and gets swept by a shine on hover.
- Tailwind
- React
- CSS
- WordPress
Description
The main button is wrapped in a coloured glow that gently breathes to catch the eye. On hover and on keyboard focus the glow widens, the button lifts a notch and a shine sweeps across it. A plain secondary link sits next to it. Button text keeps AA contrast, the focus ring is clearly visible and the shine is hidden from screen readers. With prefers-reduced-motion the glow stays still and nothing moves.
Code
Loading the code…
In the same spirit
A large heading in hollow letters where each word fills with colour from left to right, one after another.
- Tailwind
- React
- CSS
- WordPress
A product card crossed at the corner by a discount ribbon over which a glint of light sweeps.
- Tailwind
- React
- CSS
- WordPress
An integrations pitch where seven icons slowly circle a logo on two orbits.
- Tailwind
- React
- CSS
- WordPress
An offer card topped with a deck of colour swatches that fans out on hover or keyboard focus.
- Tailwind
- React
- CSS
- WordPress