Morph Cards

Morph Cards
Morph Cards

About Morph Cards

Morph Cards

Create fluid, shape-driven card interactions where every card transforms as you explore the gallery.

Morph Cards goes beyond a simple hover effect. When a card becomes active, it smoothly expands, changes its proportions, lifts, rounds its corners, zooms its image, and reveals its content while the surrounding cards compress around it.

The result is a cinematic, editorial-style card layout designed for modern Framer websites.

Preview

https://morphcards.framer.website/

Great for

  • Creative agency websites

  • Portfolio projects

  • Product showcases

  • Photography websites

  • Architecture and interior design

  • Fashion and editorial websites

  • Case study sections

  • Art and culture websites

  • SaaS feature showcases

  • Interactive landing pages

  • Experimental Framer websites

Features

  • Shape-driven card morphing

  • Active card expansion

  • Inactive card compression

  • Independent active and inactive heights

  • Adjustable card proportions

  • Active card lift animation

  • Dynamic border-radius transitions

  • Image zoom on activation

  • Smooth image scaling

  • Animated content reveal

  • Optional descriptions

  • Custom typography with Framer Font controls

  • Custom easing presets

  • Adjustable animation duration

  • Custom overlay color

  • Custom title and description colors

  • Optional card borders

  • Adjustable card spacing

  • Up to 8 editable cards

  • Image controls for every card

  • Keyboard navigation

  • Focus states

  • Reduced-motion support

  • Static renderer support

  • Lightweight CSS-based animation

  • No external animation libraries

  • Responsive Framer layout support

Support

Need help customizing Morph Cards or using it in your Framer project?

Email: karimsaif010@gmail.com

X: https://x.com/karimsaif0

I'm happy to help with setup, customization, and usage questions.

From Karim Saif

GSAP lnertia Grid
Blur Carousel
Thread Cards
Magnetic Cards

Related Components

Polaroid Flip Card
Pixel Hover Card
Glow Pricing
Switching Tabs Card