Cursor Lens Gallery
Gallery grid where the cursor becomes a lens — greyscale everywhere, full colour and detail only inside the circle.
Le prompt
# Cursor Lens Gallery — Interactive Gallery Section ## Goal Build a gallery section of 9-12 images rendered desaturated, with a circular 'lens' following the cursor that reveals the full-colour, higher-detail version underneath. It must drop cleanly into an existing Next.js + Tailwind project as a self-contained component. ## Design Spec - Two stacked copies of each image: a greyscale base and a colour layer masked to a circle centred on the pointer. - Lens diameter 180px on desktop, with a 1px white ring at 30% opacity and a soft 24px feather at the mask edge. - Grid is 3 columns of uneven
Débloquez le prompt complet de 334 mots avec l'accès à vie en paiement unique.
Unlock Full PromptVous aimerez aussi
Heritage Grove Footer
Full-viewport footer laid straight onto a hand-drawn ink landscape loop — five columns on the paper sky, and below 1100px the clip leaves the background and becomes a flow item under the copy.
Magnetic CTA Cluster
Buttons that pull toward the cursor within a radius, with the label lagging behind the shell for weight.
Cast & Render
Single-file scroll-scrubbed landing for a 3D studio: scrolling scrubs a fixed all-intra background video frame by frame while three text panels cross-fade over it, with no framework and no build step.
Aethera
Fullscreen white hero: an Instrument Serif headline over a looping video band that hand-fades in and out on every pass.
