---
title: "Morph Deck — Framer component · Best of Framer"
description: "$10.00 · Framer component · by Kullen Jahnke · Cards. Morph Deck is a responsive Framer component for interactive card decks that fan out and expand, with an overlapping fanned…"
canonical: "https://framer.elliotli.dev/component/morph-deck"
---

[Home](/)/[Components](/components)/[Cards](/components/category/cards)/Morph Deck

# Morph Deck

Custom click-to-expand card deck

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

![Morph Deck preview image 1](https://framer.elliotli.dev/og/component/morph-deck/e08c58be7145709d/1600x1200.jpg)

## Summary

Morph Deck is a responsive Framer component for interactive card decks that fan out and expand, with an overlapping fanned layout, click-to-expand morph, cards that dock beneath…

## Description

**Morph Deck** is a responsive Framer component for interactive card decks that fan out and expand, with an overlapping fanned layout, click-to-expand morph, cards that dock beneath the open one, your own components as the cards, hover lift, a blur-in entrance, and multiple independent decks per page.

**Use Cases**

Works well for:

-   portfolio highlights
    
-   project and case-study showcases
    
-   product feature cards
    
-   service or pricing cards
    
-   team and people cards
    
-   photography and gallery decks
    
-   testimonial and review sets
    
-   feature tours
    
-   "what we do" sections
    

Perfect when you want a card section that invites a click and opens into detail, instead of a flat grid or a plain carousel.

\--------------------------------------------------------------

**Customization**

Fully customizable via the properties panel:

-   connected cards (your own components, up to 8)
    
-   overlap
    
-   tilt
    
-   open size
    
-   dock offset
    
-   overflow (clip or spill)
    
-   padding
    
-   hover lift
    
-   hover scale
    
-   morph spring (open and close motion)
    
-   entrance on or off
    
-   entrance trigger (in view or on load)
    
-   entrance stagger
    
-   entrance duration
    
-   entrance rise
    
-   entrance blur
    
-   canvas preview (fan or expanded)
    

Each card is your own component with Collapsed and Expanded variants, the card design stays yours. The deck only handles the fan, the morph, and the docking.

\--------------------------------------------------------------

**Responsive Behavior**

-   **Desktop:** full fan with hover lift; click a card to expand it while the rest dock beneath it.
    
-   **Tablet:** same structure, sized to the component's width.
    
-   **Mobile:** hover is dropped and cards open on tap; layout adjusts for narrow widths.
    

Morph Deck fits itself to whatever container you place it in.

\--------------------------------------------------------------

**Preview:** [https://morph-deck-preview.framer.website/](https://morph-deck-preview.framer.website/)

**Included:** The component and its DeckCard overrides, plus the live preview with tutorial.

**Note:** hover lift is pointer-only (cards open on tap or touch), and each card needs two variants named exactly `Collapsed` and `Expanded`.

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

-   All · #3162

## Details

- **Author**: Kullen Jahnke
- **Price**: $10.00
- **Published**: 2026-07-24
- **Updated**: 2026-07-27
- **Added**: 2026-07-24
- **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
