SVG Hover Image Card

SVG Hover Image Card is a fully animated hover-reveal component built with Framer Motion.

SVG Hover Image Card is a fully animated hover-reveal component built with Framer Motion. On hover, scattered SVG strokes sweep in from off-canvas, thicken until they fully cover the image, then reveal a title, description, and an optional color panel behind them — all customizable live inside Framer, no code required. Every part of the effect is yours to control: swap in your own photo, paste custom SVG paths to change the stroke shapes entirely, adjust stroke count and thickness for tighter or looser coverage, fine-tune reveal timing and stagger, and choose a solid color, linear gradient, or radial gradient for the content background. Full font controls for both title and description, tap support for mobile and touch devices, and clean defaults mean it looks great the moment you drop it on canvas. BEST USE CASES • Team and staff directory pages — reveal each member's name and role on hover • Portfolio and case study grids — reveal project titles and short descriptions • Personal "about me" sections and creative portfolio sites • Agency and studio "meet the team" pages • Speaker, author, or contributor bio cards • Product or feature highlight cards with a reveal-on-hover title REFUND POLICY: All sales are final. Because this is a digital component delivered instantly and fully preview able before purchase, we do not offer refunds once it has been bought. Please review the preview, property list, and demo carefully before buying to make sure it fits your project.

SVG Hover Image Card: Stroke Sweep