---
title: "Sales Dashboard — Free Framer component · Best of Framer"
description: "Free Framer component · by Abdul Sami · Cards. 📊 A sales dashboard for anyone selling a small catalogue — set up entirely from the properties panel, no code to touch."
canonical: "https://framer.elliotli.dev/component/sales-dashboard"
---

[Home](/)/[Components](/components)/[Cards](/components/category/cards)/Sales Dashboard

# Sales Dashboard

See what earns, not just sells

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

![Sales Dashboard preview image 1](https://framer.elliotli.dev/og/component/sales-dashboard/49f218abcbe7c4d2/1600x1200.jpg)

## Summary

📊 A sales dashboard for anyone selling a small catalogue — set up entirely from the properties panel, no code to touch.

## Description

📊 A sales dashboard for anyone selling a small catalogue — set up entirely from the properties panel, no code to touch.

Most dashboard components hand you a grid of identical cards. This one leads with a leaderboard where every row _is_ its own bar, so your ranking and your chart become the same object.

⚡ What's inside

\- 🏆 Leaderboard rows that double as bars — click one to drill in

\- 📈 12-week earnings chart with hover readout

\- 🎯 Views → previews → purchases funnel, with conversion

\- 💳 Orders table and a pending payout pill

\- 🗓 7 / 30 / 90-day ranges that recalculate everything

🎛 Yours to shape

\- ✏ Add products — name, category, price, demand, trend

\- 🎨 Six colour controls and radius; borders derive from them

\- 🔀 Toggle the payout, funnel and orders sections

\- 💱 Six currencies, adjustable fee

📱 Responsive, keyboard-navigable, reduced-motion aware. Animation runs in Preview only — never on your canvas.

ℹ Figures come from the values you set, not live sales data.

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

-   All · #4337

## Details

- **Author**: Abdul Sami
- **Published**: 2026-09-05
- **Updated**: 2026-09-05
- **Added**: 2026-09-05
- **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