---
title: "Price 3D Card — Framer component · Best of Framer"
description: "$14.00 · Framer component · by Aidan Looker · Cards. What is Price 3D Card?"
canonical: "https://framer.elliotli.dev/component/price-3d-card"
---

[Home](/)/[Components](/components)/[Cards](/components/category/cards)/Price 3D Card

# Price 3D Card

Interactive pricing cards with tilt.

[View on Framer](https://framer.com/marketplace/components/price-3d-card/?via=elliot-li)

![Price 3D Card preview image 1](https://framer.elliotli.dev/og/component/price-3d-card/aad9175aa25019ef/1600x1200.jpg)

## Summary

What is Price 3D Card?

## Description

## What is Price 3D Card?

Price 3D Card is a fully interactive pricing component with smooth 3D tilt on hover, a flip animation between monthly and yearly billing, and an automatic savings badge. Customise up to four pricing tiers with features, tooltips, icons, and call-to-action buttons. Ideal for SaaS landing pages, product pricing sections, agency service pages, and membership portals.

[![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-8vjwbcr2-RQLDut7AgLOovQEwgaJNpNG4n3n3B6)](https://teampixelau.lemonsqueezy.com/checkout/buy/3b016e8d-2ba4-4944-8431-e2c592334df1)

## Core Features

-   Interactive 3D tilt effect that follows the cursor, with adjustable sensitivity and spring physics
    
-   Smooth card flip animation to toggle between monthly and yearly pricing with staggered delays
    
-   Automatic savings badge that calculates and displays the percentage saved on yearly billing
    
-   Customisable "Most Popular" badge with gradient styling and subtle glow pulse animation
    
-   Feature tooltips that appear on hover for information-rich feature lists
    
-   14 supported currencies including USD, EUR, GBP, JPY, AUD, CAD, CHF, NZD, ZAR, SEK, INR, BRL, PLN, and KRW
    
-   Four built-in theme presets: Glass, Dark, Gradient, and fully Custom
    

## Controls inside Framer

### Plans

-   Plan name and subtitle
    
-   Monthly price and yearly total (up to 10,000)
    
-   Built-in or custom icon per plan
    
-   "Most Popular" badge toggle
    
-   CTA button text and link
    
-   Feature list with optional tooltip for each item
    

### Theme and Currency

-   Theme preset: Glass, Dark, Gradient, Custom
    
-   Currency symbol selector (14 currencies)
    
-   Billing period label (e.g. "month", "year")
    
-   Background colour
    

### Toggle

-   Show or hide the monthly/yearly toggle
    
-   Custom labels for monthly and yearly
    
-   Savings badge visibility
    

### Card Style

-   Corner radius
    
-   Glow intensity
    
-   Tilt sensitivity
    
-   Flip animation speed
    

### Typography

-   Heading font
    
-   Price font
    
-   Body font
    
-   Button font
    

### Custom Colours (visible when theme is set to Custom)

-   Accent, glow, glow alt, card background
    
-   Primary and secondary text
    
-   CTA background and text
    
-   Badge gradient start and end
    
-   Toggle background, thumb, and border
    
-   Tooltip background
    

## Best use cases

-   SaaS and software product pricing pages with monthly and yearly billing
    
-   Agency and freelancer service tier comparisons
    
-   Membership and subscription-based platforms
    
-   Product landing pages that need a premium, interactive pricing section
    

Build trust and drive conversions with pricing cards that feel premium. Drop in, configure, and ship.

## Questions or custom requests?

We design and build custom Framer components. Get in touch at [contact@teampixel.com.au](mailto:contact@teampixel.com.au)

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

-   All · #9360

## Details

- **Author**: Aidan Looker
- **Price**: $14.00
- **Published**: 2026-04-10
- **Updated**: 2026-06-13
- **Added**: 2026-03-22
- **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