---
title: "Pricing Receipt Card — Free Framer component · Best of Framer"
description: "Free Framer component · by Tamás Péter · Cards. Interactive receipt card"
canonical: "https://framer.elliotli.dev/component/pricing-receipt-card"
---

[Home](/)/[Components](/components)/[Cards](/components/category/cards)/Pricing Receipt Card

# Pricing Receipt Card

Interactive receipt card

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

![Pricing Receipt Card preview image 1](https://framer.elliotli.dev/og/component/pricing-receipt-card/144ed6229f33474d/1600x1200.jpg)

## Summary

Interactive receipt card

## Description

What's included:

-   3 theme presets — Dark, Light, and Custom
    
-   Custom theme: 18 individual color controls covering background, text, checkboxes, button states, barcode, and footer
    
-   Up to 5 service rows — each with a label, price, and interactive checkbox
    
-   Max Checked control: set to 1 for radio-button behavior (one service at a time), or 2–5 to allow multi-select
    
-   Price display updates automatically when the active service changes
    
-   Animated price scramble — characters reveal right-to-left; reveal speed (ms per character) and scramble speed configurable separately
    
-   Optional split payment row — toggling it switches the displayed price and sub-label simultaneously
    
-   Two sub-label states: separate editable text for single ("ONE-TIME") and split ("× 2 MONTHS") modes
    
-   Strikethrough animation on unchecked services — width (%), thickness, Y offset, and animation speed all adjustable
    
-   CTA button with wave scramble effect on hover — links to any URL, anchor, or internal page
    
-   Zigzag top and bottom edges — tooth width and tooth height both adjustable — or disable for a flat border
    
-   Decorative barcode rendered in code — no image file, no external asset
    
-   Optional footer text field (toggleable)
    
-   Responsive — separate font size setting for mobile, breakpoint at 480px
    
-   Width in fixed px or relative % of the parent container
    
-   All labels, prices, button text, and footer editable from the Framer property panel
    
-   No external dependencies, no custom code required
    

Drop it into any Framer project, set your services and prices in the property panel, and ship.

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

-   All · #5223

## Details

- **Author**: Tamás Péter
- **Published**: 2026-06-02
- **Updated**: 2026-08-13
- **Added**: 2026-05-19
- **Categories**: Cards

## More like this

-   [Particle Team Cards](/component/particle-team-cards) — Frame Native · Free — Portraits that move as particles
-   [Card Swap](/component/card-swap) — Antoine Lacombled · $9 — A 3D card stack you can fling
-   [Overlay Reveal Card](/component/overlay-reveal-card) — Pentaclay · Free — Project Card With Hover Overlay
-   [Deckshift](/component/deckshift) — BeyondPixel · $15 — Interactive Stacked Focus Cards