Overview
A card that lights from the inside. A slit across its middle becomes a light source under the cursor, three stacked cones rise out of it, the shadows underneath deepen as they brighten, and the corner brackets pull in while the card lifts. Keyboard focus and touch reach the same lit state, so the effect is not reserved for a mouse. The palette, the corner radius, the bracket arms, the glow and the lift are all editable, and the whole thing is CSS with no JavaScript in the export.
Highlights
- Lights on hover, with keyboard focus and touch reaching the same state
- Three stacked light cones rising out of a slit, in CSS only
- Editable palette, corner brackets, glow and lift
- Indicator switch hidden from screen readers and a reduced-motion pose
