shimmer-button

Installation
SKILL.md

shimmer-button

A highlight that sweeps across a CTA. Part of motion-anything; obeys MOTION-SPEC.md. Technique popularized by Magic UI, reimplemented dependency-free (pure CSS).

When to use it

  • One primary call-to-action you want to feel premium ("Get started" / "Upgrade").

When NOT to use it (restraint)

  • Secondary / destructive buttons; many buttons at once (the sweep becomes noise). One per view.

How to apply

  1. Copy shimmer-button.css into the project and link it.
  2. Mark the button:
    <button class="shimmer">Get started</button>
    
  3. Tune the sweep duration (default 2.6s at rest, 1.1s on hover) and the button colors as needed.
Installs
1
GitHub Stars
805
First Seen
9 days ago
shimmer-button — nexu-io/motion-anything