SPOTLIGHT CARDS
Nine ways a card can answer the visitor, in three groups, each playing on one of our demo pages. Hover or tap to try them.
01Three cards
Light
Light that follows the pointer or runs across the card. Quiet, and it tells a visitor the card is alive.
Spotlight
Radial gradient follows your cursor inside the card.
Glare
Diagonal light sweep crosses the card on hover.
Border Gradient
Animated conic gradient spins around the card border.
02Three cards
Depth
The card answers the hand: it lifts, leans toward the pointer or tilts in space.
Lift & Glow
Card lifts up and casts a colored glow underneath.
Magnetic
The entire card attracts toward your cursor.
Tilt 3D
Card tilts in 3D space following your cursor position.
03Three cards
Attention
What the card says changes: a title that resolves, details on demand, a slow pulse.
Scramble
Title text scrambles through random characters then resolves.
Scale Pulse
Card scales up and pulses subtly while hovered.
Every card here is plain CSS and React, light enough to use on every page of a site.
Start a project