---
title: "SVG Hover Image Card — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Talha Manzoor · Cards. SVG Hover Image Card is a fully animated hover-reveal component built with Framer Motion."
canonical: "https://framer.elliotli.dev/component/svg-hover-image-card"
---

[Home](/)/[Components](/components)/[Cards](/components/category/cards)/SVG Hover Image Card

# SVG Hover Image Card

SVG Hover Image Card: Stroke Sweep

[View on Framer](https://framer.com/marketplace/components/svg-hover-image-card/?via=elliot-li)

![SVG Hover Image Card preview image 1](https://framer.elliotli.dev/og/component/svg-hover-image-card/efef13dcf77bfcbb/1600x1200.jpg)

## Summary

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

## Description

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.

## Rank history [How rankings work →](/terms#rankings)

-   All · #6406

## Details

- **Author**: Talha Manzoor
- **Price**: $5.00
- **Published**: 2026-07-12
- **Updated**: 2026-07-13
- **Added**: 2026-07-12
- **Categories**: Cards

## More like this

-   [AlumniDestinations](/component/alumnidestinations) — Dulaj Design · $15 — About AlumniDestinations adds a professional, interactive directory to your Framer projects, specifically designed to showcase the success…
-   [AIJobCards](/component/aijobcards) — Dulaj Design · $15 — Beautiful interactive career grids
-   [Editorial Image Card](/component/editorial-image-card) — Victoriia Topalova · Free — Beautiful image cards for lifestyl
-   [Zipper Card](/component/zipper-card) — Aslı Ay · $12 — A padded card you unzip by hand.