---
title: "Hover Media Cards — Framer component · Best of Framer"
description: "$6.00 · Framer component · by Ahmet Loca · Cards. Hover Media Cards is an interactive image and video card component for Framer."
canonical: "https://framer.elliotli.dev/component/hover-media-cards"
---

[Home](/)/[Components](/components)/[Cards](/components/category/cards)/Hover Media Cards

# Hover Media Cards

Hover Reveal Cards, Smooth Motion

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

![Hover Media Cards preview image 1](https://framer.elliotli.dev/og/component/hover-media-cards/1ec8d5c9d7257da1/1600x1200.jpg)

## Summary

Hover Media Cards is an interactive image and video card component for Framer.

## Description

**MORE FRAMER COMPONENTS LIKE THIS**

**✦ Browse +38 FREE + 85 premium components:** [**https://frameze.com/components**](https://frameze.com/components)

**✦ Get everything for one price:** [**https://ahmetloca.dub.link/allcomponents**](https://ahmetloca.dub.link/allcomponents)

## **About Hover Media Cards**

Hover Media Cards is an interactive image and video card component for Framer. Cards expand on hover with a smooth blur and reveal animation, showing a title, subtitles and a call-to-action button. Supports 2–3 columns, per-card glow, badges and custom overlays. Fully responsive with mobile tap support. Perfect for portfolios, agencies and landing pages.

-   Expand on hover — active card grows wider with a smooth flex-grow animation
    
-   Blur & reveal — image blurs as title, subtitles and CTA fade in with depth
    
-   Image & video support — upload via Framer or paste any external video URL
    
-   Staggered animations — title, subtitles and arrow cascade in with timed delay
    
-   Glow effect — optional soft glow highlights the hovered card edge
    
-   Per-card overlay color — set a unique tint color for each card individually
    
-   Badge & tag system — add labels like NEW or SALE with custom colors per card
    
-   3 arrow styles — circle outline, filled button or no arrow
    
-   3 content alignments — bottom-left, bottom-center or vertically centered
    
-   7 aspect ratios — auto, 21:9, 16:9, 4:3, 1:1, 3:4 and 9:16
    
-   Mobile responsive — stacks vertically with tap-to-reveal on touch devices
    

**Live Preview:** [**https://hovermediacards.framer.website/**](https://hovermediacards.framer.website/)

**Use Cases**

-   Portfolio & personal branding websites
    
-   Creative agency & studio showcase pages
    
-   Fashion, lifestyle & lookbook sections
    
-   Photography & visual storytelling galleries
    
-   Film, media & production company sites
    
-   Architecture & interior design portfolios
    
-   Product & service feature highlight sections
    
-   Real estate & property listing pages
    
-   Travel & hospitality brand websites
    
-   SaaS marketing & feature overview pages
    

**Keywords**

hover media cards framer, hover reveal cards, image cards, video cards, hover cards framer, interactive cards framer, blur reveal, card grid, expand on hover, animated cards

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

-   All · #2778

## Details

- **Author**: Ahmet Loca
- **Price**: $6.00
- **Published**: 2026-06-05
- **Updated**: 2026-09-29
- **Added**: 2026-05-30
- **Categories**: Cards

## More like this

-   [BlogX Blog Card](/component/blogx-blog-card) — Themomarket · $8 — Blog Framer Component
-   [FluxPrice](/component/fluxprice) — Jeshan Athulesh · $49 — Elevate your SaaS conversion rate in minutes with FluxPrice.
-   [Feature Ribbon Cards](/component/feature-ribbon-cards) — Studio Digital · Free — Interactive image feature cards
-   [Dynamic Pricing Calc](/component/dynamic-pricing-calc) — Dmitry Vorobey · $12 — Pricing cards with live calculator