Individual skill

spotlight-card

Give feature/pricing cards a premium feel: a soft radial spotlight follows the cursor across the card and lifts its border. Keep the glow subtle and low-contrast. Falls back to a plain static border under prefers-reduced-motion and on touch. Do not use on text-dense reading surfaces.

recipes/web/spotlight-card/SKILL.md

Read pinned source

Source commit b016900d9ee92fc2d3e4dc520359cc8999d2ed4e

What was checked

Matches the observed repository HEAD: Yes
Scanner rules are current: No
Repository scan complete: No
Skill scan complete: Yes
Observed behavior: Not checked yet
Last checked: Nov 4, 2026

These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.

Install this skill

Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.

An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.

Repository context

Repository stars (not skill ratings): 1,059
Repository last updated: Jul 7, 2026
License: Apache-2.0

Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.

ai-agent Repository topic
animation Repository topic
claude Repository topic
design-tools Repository topic
motion-design Repository topic
motion-graphics Repository topic
webgl Repository topic
figma-motion-alternative Repository topic
engineering Derived category

Files and excerpt

File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.

Browse files

SKILL.mdcore · 2,024 bytes
preview.htmlasset · 1,678 bytes
recipe.motion.yamlasset · 1,859 bytes
spotlight-card.cssasset · 1,073 bytes
spotlight-card.jsruns · 1,316 bytes

Read excerpt


# spotlight-card

A radial spotlight that follows the cursor across a card. Part of
[motion-anything](https://github.com/nexu-io/motion-anything); obeys `MOTION-SPEC.md`. Technique
popularized by Aceternity UI, reimplemented dependency-free.

## When to use it
- Feature cards, pricing tiles, or a card grid where one should light up under the pointer.

## When NOT to use it (restraint)
- Text-dense reading surfaces — the glow distracts. Keep it low-contrast and subtle.
- Touch-only contexts — there is no cursor; it falls back to a static border automatically.

## How to apply