MRR waterfall
ProAn MRR bridge whose floating bars morph by period and open the accounts behind each move.
MRR movement
All plans · Jul 1 – Sep 30, 2025
Ending MRR on Sep 30
$465,650
+$53,270+12.9%since Jul 1
- Net revenue retention
- 97.7%
- Quick ratio
- 2.32
- Logo churn
- 9.5%
New business
+$55,800187 new accounts
- Granite Mutual+$6,400Sep · Enterprise, annual
- Northpeak Logistics+$5,200Aug · Enterprise, annual
- Halcyon Health+$4,800Jul · Enterprise, annual
- Orchard Health+$2,320Sep · Scale, 80 seats
- Kestrel Freight+$1,740Jul · Scale, 60 seats
- Other accounts+$35,340182 accounts
Select a bar or use the arrow keys to see its accounts
| Movement | Amount | Share of starting MRR | Accounts |
|---|---|---|---|
| Starting MRR | $412,380 | 100.0% | 1,241 |
| New business | +$55,800 | 13.5% | 187 |
| Expansion | +$31,060 | 7.5% | 123 |
| Reactivation | +$6,780 | 1.6% | 27 |
| Contraction | −$13,830 | 3.4% | 60 |
| Churn | −$26,540 | 6.4% | 118 |
| Ending MRR | $465,650 | 112.9% | 1,337 |
- Revenue or board reporting that explains how MRR moved from start to end of a period.
- Finance views where each movement should list the accounts behind it.
- Use revenue-explorer for MRR over many months.
- Use bar-chart for plain comparisons that do not build from a start value.
- Use cohort-retention for retention by cohort.
Installation
Pro source and install commands unlock with a Pro plan.
Usage
Use this on a revenue or board reporting page to explain how MRR moved. Replace the seeded months and accounts in mrr-data.ts with your billing movements; levels, axis, ratios and lists are computed from them.
import { MrrWaterfall } from "@/components/arc/blocks/mrr-waterfall/mrr-waterfall"; export default function RevenuePage() { return ( <section> <MrrWaterfall /> </section> );}MrrWaterfall
An MRR bridge with floating bars per movement, a period switch and a panel listing the accounts behind the selected bar. Takes no props; periods, movements and accounts are sample data in mrr-data.ts.
No props.
- Arrow keys
- Moves the selection to the previous or next bar, wrapping at the ends.
- HomeorEnd
- Selects the first or last bar.
- Bars are a role="radiogroup" of radio buttons with roving tabindex; each label reads the movement, amount and account count.
- The chart SVG carries a text summary, and the accounts panel is labelled by the selected movement.
- A polite live region announces each newly selected bar.
- Bars morph to new levels when the period changes, and the account list reorders with layout animation.
- Headings and figures swap with a short rise, and totals roll with the animated counter.
- Reduced motion swaps values without movement.
- Below an 800px container the accounts panel moves under the chart.
- Below 560px the summary stats become a three column row with smaller figures.
- Hover previews apply only to mouse pointers; touch taps select a bar.
- A handful of SVG bars per period, sized by ResizeObserver; cheap at any size.
- Account lists are not virtualized, so cap or paginate large movements.
Notes for AI
Give your coding assistant the Markdown reference instead of screenshots.
- Use on a revenue or board reporting page to explain how MRR moved between periods.
- Replace PERIODS in mrr-data.ts with your billing movements; levels, axis and lists are computed from them.
The full library index for assistants is at /llms.txt.