30 Claude Prompts That Build SaaS Dashboards

You are a SaaS churn analyst who builds logo-churn rate boards from starting counts, not vibes. <context> I need a logo-churn rate dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Product name: [PRODUCT NAME] - Months of history: [E.G. 12] - Logo-churn target: [E.G. 2.5% PER MONTH] - Starting logos in month 1: [OR INVENT] - Sample cancel counts per month: [OR INVENT] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (starting logos this month, logos lost, logo churn %, versus target); a month selector; a line of monthly logo churn % with the target drawn; a bar of logos lost; a table (month, starting logos, lost, added if you seed them, ending, rate); and a high-churn-month callout. Compute logo churn as lost / starting logos for that month. Ending logos must equal starting minus lost plus added. Clicking a month updates the cards and the callout. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Monthly counts in labeled JS constants at the top. - Rate uses starting logos, never ending logos. Guard a zero start. - Above-target months flagged with color and the word above target. - Do not invent revenue churn on this screen. Logos only. </constraints> <format> Return the full HTML as an artifact, then write the logo-churn formula and which arrays to replace with a cancel export. </format>

You are a SaaS churn analyst who puts revenue churn and logo churn on the same screen so they cannot tell different stories. <context> I need a revenue-versus-logo churn dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Window to show: [CHURN WINDOW] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Months of history: [E.G. 12] - Starting logos and starting MRR: [OR INVENT] </inputs> <task> Build the dashboard with: a header naming [CHURN WINDOW]; a KPI row (logo churn %, revenue churn %, gap in percentage points, interpretation); a dual line of the two rates; a month table (starting logos, lost logos, starting MRR, churned MRR, both rates); and a divergence callout (whale loss when revenue churn is higher, small-logo pile when logo churn is higher). Compute logo churn as lost logos / starting logos and revenue churn as churned MRR / starting MRR. Clicking a month shows the interpretation for that month. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Counts and dollars in labeled JS constants at the top. - Both rates computed, never hardcoded. Guard zero denominators. - Divergence uses a labeled rule, not a vibe. Accessible contrast. - Do not add expansion or NRR on this screen. Churn only. </constraints> <format> Return the full HTML as an artifact, then write both formulas and which arrays to replace. </format>

You are a SaaS churn analyst who reads cancels by tenure so early-life churn does not hide inside a blended rate. <context> I need a churn-by-tenure dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Tenure bands: [TENURE BANDS] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Period of cancels: [E.G. LAST 90 DAYS] - Sample cancel rows (start date, cancel date, MRR): [OR INVENT] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (cancels, MRR lost, hottest band by logos, hottest band by MRR); a bar of cancel count by each item in [TENURE BANDS]; a second bar of MRR lost by band; a table (band, logos, MRR, share of cancels, share of MRR); and a hottest-band callout. Assign each cancel to a band from tenure months between start and cancel. Clicking a band filters a cancel list (id, tenure months, MRR). </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Cancel rows and band edges in labeled JS constants at the top. - Band assignment is computed from dates, not pre-tagged unless I said so. - Hottest band is computed twice (logos and MRR) and both are shown when they differ. - Accessible contrast; responsive layout. </constraints> <format> Return the full HTML as an artifact, then explain tenure math and which cancel array to replace. </format>

You are a SaaS churn analyst who builds cancel-reason scorecards for a retention standup, not an NRR page. <context> I need a cancel-reason scorecard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. This is reason ops. Do not compute NRR here. </context> <inputs> - Cancel reasons: [CANCEL REASONS] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Period: [E.G. LAST 90 DAYS] - Optional month split: [E.G. LAST 3 MONTHS] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (cancels, MRR lost, top reason by MRR, top reason by logos); a horizontal bar of MRR lost by each item in [CANCEL REASONS]; a period toggle if I gave months; a rank table (reason, logos, MRR, share, versus prior period if seeded); and a one-line next-step note labeled as a hypothesis. Clicking a reason filters a cancel list. Rank is computed from MRR lost, with a secondary sort on logos. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Reason totals in labeled JS constants at the top. - Do not invent a reason I did not list. Put leftovers in Other only if I said so. - No NRR, GRR, or expansion widgets. - Accessible contrast; not color-only ranks. </constraints> <format> Return the full HTML as an artifact, then say which reason arrays to replace with your reason codes. </format>

You are a SaaS billing analyst who splits voluntary churn from involuntary (failed-payment) churn. <context> I need a voluntary-versus-involuntary churn dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Churn types to split: [CHURN TYPES] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Months of history: [E.G. 12] - Dunning stages if useful: [E.G. RETRY 1, RETRY 2, CANCELED] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (total churned MRR, voluntary MRR, involuntary MRR, involuntary share); a stacked bar of the two types over time using [CHURN TYPES]; a dunning-stage table if I gave stages; an involuntary watchlist (account, amount, last failed date, stage); and a callout when involuntary share jumps versus the prior three months. Compute shares from type totals. Clicking involuntary filters the watchlist. Clicking voluntary hides dunning rows. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Type and dunning rows in labeled JS constants at the top. - Involuntary share is computed. A jump is versus the prior three-month average, labeled on the page. - Do not invent card networks or bank errors. Amounts and stages only. - Accessible contrast; responsive layout. </constraints> <format> Return the full HTML as an artifact, then explain the split and which dunning array to replace. </format>

You are a SaaS retention analyst who builds trailing NRR windows so a single 12-month number cannot hide a recent slide. <context> I need a trailing NRR window dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. This is multiple lookbacks, not the finance NRR overview. </context> <inputs> - Windows to compute: [TRAILING WINDOWS] - Company name: [COMPANY NAME] - Currency: [E.G. USD] - Month-end snapshots of the starting-account set: [OR INVENT] - NRR floor you care about: [E.G. 100%] </inputs> <task> Build the dashboard with: a header for [COMPANY NAME]; a KPI row for each window in [TRAILING WINDOWS] (NRR, GRR, beginning MRR of that set); a window switcher that restates the cards from that lookback; a line of each window over ending months; a table (ending month, NRR 3, NRR 6, NRR 12, or the windows I gave); and a callout of the window that dropped most versus the prior ending month. Compute NRR as (beginning MRR of the starting set - churn - contraction + expansion) / beginning MRR. New logos that joined after the window start are excluded. Clicking a window filters the table highlight. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Snapshot arrays in labeled JS constants at the top. - Show the NRR formula in a comment and on a footnote. - Below-floor windows flagged. Accessible contrast. 100 percent line labeled. - Do not invent logo-level names unless you seed sample accounts. </constraints> <format> Return the full HTML as an artifact, then explain starting-set rules and which snapshot arrays to replace. </format>

You are a SaaS retention analyst who splits NRR by customer size so a healthy enterprise number cannot hide SMB churn. <context> I need an NRR-by-size-band dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Size bands and MRR edges: [SIZE BANDS] - Company name: [COMPANY NAME] - Currency: [E.G. USD] - Period: [E.G. TRAILING 12 MONTHS] - Sample accounts with beginning MRR and movements: [OR INVENT] </inputs> <task> Build the dashboard with: a header for [COMPANY NAME]; a KPI row (company NRR, company GRR, weakest band, logos in that band); a grouped bar of NRR and GRR by each item in [SIZE BANDS]; a table (band, logos, beginning MRR, churn, contraction, expansion, GRR, NRR); and a weakest-band callout. Assign each account to a band from beginning MRR, never from ending MRR. Compute GRR as (beginning - churn - contraction) / beginning and NRR as (beginning - churn - contraction + expansion) / beginning. Clicking a band filters an account list. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Accounts and band edges in labeled JS constants at the top. - Weakest band is lowest NRR, computed. Company totals must reconcile to the sum of bands. - Accessible contrast; 100 percent line on the bar. - Do not invent industries or CS owners unless I gave them. </constraints> <format> Return the full HTML as an artifact, then write GRR and NRR formulas and which account array to replace. </format>

You are a SaaS retention analyst who builds an NRR formula waterfall for a starting-account set, not a company MRR movement bridge. <context> I need an NRR formula waterfall as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. Walk beginning MRR through churn, contraction, and expansion to ending MRR of that same set. Do not add new logos. </context> <inputs> - Beginning MRR of the starting set: [STARTING MRR] - Company name: [COMPANY NAME] - Currency: [E.G. USD] - Period: [E.G. TRAILING 12 MONTHS] - Churn, contraction, and expansion dollars: [OR INVENT FROM STARTING] </inputs> <task> Build the dashboard with: a header for [COMPANY NAME]; a KPI row (beginning MRR from [STARTING MRR], GRR %, NRR %, ending MRR of the set); a waterfall (beginning, minus churn, minus contraction, plus expansion, equals ending) that reconciles; a second small bar of each step as a percent of beginning; a step table with dollars and percent of beginning; and a click on a step that lists the five largest accounts in that step (sample rows). Compute GRR and NRR from the same constants as the waterfall. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Step dollars in labeled JS constants at the top. - Waterfall must reconcile: beginning - churn - contraction + expansion = ending. Flag a break. - Do not include new-logo MRR. Label that exclusion on the page. - Currency consistent; accessible contrast. </constraints> <format> Return the full HTML as an artifact, then explain why new logos are out and which step arrays to replace. </format>

You are a SaaS retention analyst who builds NRR-by-segment boards a QBR can reuse. <context> I need an NRR-by-segment dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Segments: [SEGMENTS] - Company name: [COMPANY NAME] - Currency: [E.G. USD] - Period: [E.G. TRAILING 12 MONTHS] - Per-segment beginning MRR and movements: [OR INVENT] </inputs> <task> Build the dashboard with: a header for [COMPANY NAME]; a KPI row (company NRR, company GRR, laggard segment, laggard NRR); a bar of NRR by each item in [SEGMENTS] with a 100 percent reference line; segment chips that isolate one bar and its table row; a table (segment, logos, beginning MRR, GRR, NRR, expansion, churn); and a laggard callout. Compute every rate from that segment's movements. Isolating a segment dims the other bars and filters the table to one row plus a short account sample. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Segment movements in labeled JS constants at the top. - Laggard is lowest NRR, computed. Company NRR is the dollar-weighted blend, not the average of percents. - Accessible contrast; 100 percent line labeled. - Do not invent CSAT or ticket scores. </constraints> <format> Return the full HTML as an artifact, then explain dollar-weighted NRR and which segment arrays to replace. </format>

You are a SaaS finance partner who tracks NRR versus a stated target, month after month. <context> I need an NRR-versus-target tracker as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - NRR target: [NRR TARGET] - Company name: [COMPANY NAME] - Months of NRR history: [E.G. 12] - GRR series if I have it: [OR INVENT] - How the target was set: [E.G. BOARD PLAN] </inputs> <task> Build the dashboard with: a header for [COMPANY NAME]; a KPI row (latest NRR, target from [NRR TARGET], gap in points, months below target in the series); a line of NRR versus a flat target; a GRR line if seeded; a gap bar (NRR minus target) by month; a table of the series; and a gap callout that names how many points of expansion or avoided churn would close it, using the latest beginning MRR constant. Clicking a below-target month highlights that gap bar. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - NRR series and beginning MRR in labeled JS constants at the top. - Gap and months-below are computed. Do not hardcode them. - Below-target months flagged with color and the word below target. - Label the close-the-gap math as illustrative from the latest beginning MRR, not as a forecast. </constraints> <format> Return the full HTML as an artifact, then explain the gap math and which series to replace. </format>

You are a SaaS conversion analyst who builds trial-to-paid rate boards from aged trials, not a product-event funnel. <context> I need a trial-to-paid conversion dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. This is conversion rate and paid MRR. Do not build an in-app step funnel. </context> <inputs> - Trial length: [TRIAL LENGTH] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Weeks of start cohorts: [E.G. LAST 12 WEEKS] - Conversion target: [E.G. 18%] </inputs> <task> Build the dashboard with: a header naming [TRIAL LENGTH]; a KPI row (starts, converted, pending, conversion rate among aged trials, paid MRR from converts); a weekly line of conversion rate versus the target; a bar of starts versus converts; a table (start week, starts, converted, expired unconverted, pending, rate, paid MRR); and a weak-week callout. A trial is pending if today is before start plus [TRIAL LENGTH]. Rate ignores pending rows. Clicking a week filters a small trial list. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Weekly trial rows in labeled JS constants at the top, plus a today constant I can edit. - Pending cells labeled pending, not zero. Guard divide-by-zero on a week with no aged trials. - Below-target aged weeks flagged. Accessible contrast. - Do not invent activation events or feature flags. </constraints> <format> Return the full HTML as an artifact, then write the aged-trial rule and which arrays to replace. </format>

You are a SaaS conversion analyst who splits trial-to-paid rate by acquisition source. <context> I need a trial-conversion-by-source dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Acquisition sources: [ACQUISITION SOURCES] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Period of trial starts: [E.G. LAST 60 DAYS] - Paid MRR per convert if known: [OR INVENT PER SOURCE] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (blended conversion rate, best source, worst source, paid MRR from converts); a bar of conversion rate by each item in [ACQUISITION SOURCES]; a bar of paid MRR by source; a table (source, starts, aged, converted, rate, paid MRR, ARPU of converts); and a callout of the source that looks strong on rate but weak on paid MRR, or the reverse. Compute rate from aged trials only. Clicking a source highlights both bars and filters the table. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Source rows in labeled JS constants at the top. - Best and worst are computed. Pending trials do not sit in the rate. - Accessible contrast; not color-only ranks. - Do not invent CAC or LTV on this screen unless I pasted them. </constraints> <format> Return the full HTML as an artifact, then explain rate versus paid-MRR ranking and which source array to replace. </format>

You are a SaaS conversion analyst who compares self-serve trials to sales-assist trials on the same clock. <context> I need a self-serve versus sales-assist trial dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Trial motions: [TRIAL MOTION] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Trial length: [E.G. 14 DAYS] - Weeks of history: [E.G. 8] </inputs> <task> Build the dashboard with: a header naming [TRIAL MOTION]; a KPI pair (conversion rate, median days to paid, paid MRR) for each motion; a motion toggle that focuses one side or shows both; a dual line of weekly conversion; a dual bar of median days to paid; a table (week, starts and converts per motion, rates, median days); and a callout of which motion wins on rate versus which wins on speed. Days to paid uses converted trials only. Pending trials stay out of the rate. Toggling a motion dims the other series. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Per-motion weekly rows in labeled JS constants at the top. - Medians computed from a days-to-paid array, not hardcoded. - Accessible contrast; both motions labeled in text, not color alone. - Do not invent win-loss notes or discount amounts. </constraints> <format> Return the full HTML as an artifact, then explain the motion split and which arrays to replace. </format>

You are a SaaS revenue-ops analyst who values the open trial book as a pipeline of possible paid MRR. <context> I need a trial MRR pipeline dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Open trials with plan and value: [TRIAL PIPELINE] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Expected conversion rate to apply: [E.G. 18% OR BY STAGE] - Stages if you use them: [E.G. STARTED, ACTIVATED, IN DISCUSSION, CLOSING] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (open trials, pipeline MRR, expected paid MRR, average pipeline value); a bar of pipeline MRR by stage if I gave stages, otherwise by plan; a sortable open-trial table from [TRIAL PIPELINE] (name or id, plan, value, days left, stage, expected MRR); and a callout of the largest open trial as a share of expected paid MRR. Expected paid MRR is sum of value times the expected rate (global or per stage). Clicking a row opens a one-line note. A rate input at the top recomputes expected paid MRR live. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Open-trial rows and rates in labeled JS constants at the top. - Expected paid MRR recomputes when I edit the rate field. - Do not treat expected MRR as a close commit. Label it expected. - Currency consistent; accessible contrast; keyboard-usable rate field. </constraints> <format> Return the full HTML as an artifact, then explain expected-MRR math and which trial array to replace. </format>

You are a SaaS conversion analyst who builds a days-left trial risk board so expiring trials do not die unread. <context> I need a days-left trial risk dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Day buckets: [DAYS LEFT] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Today date I can edit: [E.G. 2026-09-03] - Sample open trials with end dates and plan value: [OR INVENT] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (open trials, expiring in 3 days, expiring in 7 days, pipeline MRR in the shortest bucket); a bar of counts by each item in [DAYS LEFT]; a sortable risk table (id, plan, value, end date, days left, owner if given); and a shortest-clock list. Compute days left from end date minus the today constant. Bucket assignment uses [DAYS LEFT]. Sorting by days left must work. Clicking a bucket filters the table. Trials with days left under 0 are labeled expired and sit in their own row if I did not give that bucket. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Trial rows, buckets, and today in labeled JS constants at the top. - Days left is computed, never stored as the only source of truth. - Shortest clocks flagged. Accessible contrast. - Do not invent email copy or save offers. Dates and values only. </constraints> <format> Return the full HTML as an artifact, then explain the day math and which trial array to replace. </format>

You are a SaaS expansion analyst who builds expansion MRR overviews from existing-account increases only. <context> I need an expansion MRR overview as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Months of history: [E.G. 12] - Beginning MRR of existing accounts per month: [OR INVENT] - Expansion-rate target: [E.G. 4% OF BEGINNING] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (expansion MRR, expansion rate versus beginning, versus target, count of accounts that expanded); a month selector; an expansion $ bar over time; a line of expansion rate versus the target; a table (month, beginning existing MRR, expansion $, rate, accounts expanded); and a peak-month callout. Compute expansion rate as expansion $ / beginning existing MRR. Clicking a month updates the cards and lists five sample expansion events. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Monthly expansion rows in labeled JS constants at the top. - Do not include new-logo MRR in expansion. Label that rule on the page. - Below-target months flagged. Accessible contrast. - Currency consistent; responsive layout. </constraints> <format> Return the full HTML as an artifact, then write the expansion-rate formula and which arrays to replace. </format>

You are a SaaS expansion analyst who tracks billable seat growth and the accounts that stalled. <context> I need a seat-expansion dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Seat metric definition: [SEAT METRIC] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Price per seat or plan rule: [E.G. $20 PER SEAT] - Sample accounts with starting seats, current seats, last seat change date: [OR INVENT] </inputs> <task> Build the dashboard with: a header naming [SEAT METRIC]; a KPI row (net seats added, expansion MRR from seats, accounts that added seats, stalled accounts); a bar of net seats by month if you seed a monthly series; an account table (account, starting seats, current seats, delta, implied MRR lift, days since last seat change); a stalled list (no seat add in N days, N in a constant); and a click on a stalled row that shows starting versus current seats. Compute MRR lift from delta seats times the seat price rule. A stalled-days input filters the list live. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Account seat rows and the price rule in labeled JS constants at the top. - Stalled is computed from last change date versus today and the N constant. - Negative deltas (seat drops) stay visible and do not count as expansion. - Accessible contrast; keyboard-usable N input. </constraints> <format> Return the full HTML as an artifact, then explain seat-to-MRR math and which account array to replace. </format>

You are a SaaS expansion analyst who splits upsell MRR from cross-sell MRR. <context> I need an upsell-versus-cross-sell dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Expansion types: [EXPANSION TYPES] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Months of history: [E.G. 12] - Definitions I use: [E.G. UPSELL = PLAN OR SEATS, CROSS-SELL = ADD-ON PRODUCT] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (expansion MRR, upsell $, cross-sell $, upsell share); type chips for each item in [EXPANSION TYPES] that show or hide a series; a stacked bar of types over time; a table (month, dollars and count per type, upsell share); and a callout of the type that grew fastest versus the prior three months. Compute shares from the visible types when chips change. Print my definitions on the page so the split cannot drift. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Type arrays and definitions in labeled JS constants at the top. - Do not invent a third product I did not list. - Fastest-growing type is computed from dollars, labeled as a sample observation. - Accessible contrast; chips keyboard-usable. </constraints> <format> Return the full HTML as an artifact, then restate the type definitions and which arrays to replace. </format>

You are a SaaS expansion analyst who reads expansion rate by signup cohort, not as one company blended number. <context> I need an expansion-rate-by-cohort dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Signup months to show: [COHORT MONTH] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Age at which you first expect expansion: [E.G. MONTH 3] - Sample cohort rows (start month, starting logos still active, logos that expanded, expansion $): [OR INVENT] </inputs> <task> Build the dashboard with: a header naming [COHORT MONTH]; a KPI row (newest cohort size, percent that expanded, expansion $ per expanded logo, oldest-versus-newest gap); a bar of expansion rate by cohort; a bar of expansion $ by cohort; a table (cohort, active logos, expanded logos, rate, expansion $, $ per expander); and a hover or click on a cohort that shows those five numbers in a callout. Expansion rate is expanded logos / still-active logos. Cohorts younger than the expected-age constant show as too early, not as zero. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Cohort rows and the expected-age constant in labeled JS constants at the top. - Too-early cohorts labeled too early. Do not treat them as failures. - Accessible contrast; not color-only. - Do not invent churn reasons on this screen. </constraints> <format> Return the full HTML as an artifact, then write the still-active rule and which cohort array to replace. </format>

You are a SaaS expansion analyst who checks whether expansion is actually covering contraction. <context> I need a contraction-offset dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Contraction reasons: [CONTRACTION REASONS] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Months of history: [E.G. 12] - Expansion $ by month: [OR INVENT] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (expansion $, contraction $, net expansion after contraction, coverage ratio); a grouped bar of expansion versus contraction by month; a stacked bar of contraction by each item in [CONTRACTION REASONS]; a table (month, expansion, contraction, net, coverage); and a reason click that filters the contraction stack and lists sample downgrade rows. Coverage ratio is expansion / contraction when contraction is positive. Net is expansion minus contraction. Clicking a reason updates the callout (share of contraction). </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Monthly expansion, contraction, and reason splits in labeled JS constants at the top. - Coverage guards a zero contraction month and says fully covered, no contraction. - Do not move logo churn onto this screen. Staying customers only. - Accessible contrast; currency consistent. </constraints> <format> Return the full HTML as an artifact, then write coverage math and which contraction arrays to replace. </format>

You are a SaaS cohort analyst who builds revenue-retention heatmaps, not product activity heatmaps. <context> I need a revenue-retention cohort heatmap as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic decaying revenue cohorts so it opens as a working screen I can click in the chat. Cells are remaining MRR percent of beginning, not percent still active. </context> <inputs> - Metric label: [COHORT METRIC] - Product name: [PRODUCT NAME] - Cohort grouping: [E.G. SIGNUP MONTH] - Window: [E.G. MONTHS 0-11] - Number of cohorts: [E.G. LAST 8] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME] and [COHORT METRIC]; a KPI row (newest cohort beginning MRR, month-1 remaining %, month-12 remaining % or latest aged cell, newest-versus-oldest gap); a shaded heatmap (rows are cohorts, columns are month-n, cells show remaining MRR %); a line overlay of cohort curves; and a newest-versus-oldest callout. Generate decaying-but-plausible percents in labeled JS constants. Cell click shows that cohort's remaining % and remaining $. Color plus the number so the map is not color-only. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Cohort matrix in labeled JS constants at the top. - Label the metric as remaining MRR, never as active users. - Newest row first. Accessible contrast. - Do not invent product events or NPS. </constraints> <format> Return the full HTML as an artifact, then explain how to paste a real remaining-MRR matrix over the constants. </format>

You are a SaaS cohort analyst who builds logo-survival tables from still-paying counts. <context> I need a logo-survival cohort dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Signup months: [SIGNUP MONTH] - Product name: [PRODUCT NAME] - Window: [E.G. MONTHS 0-11] - Starting logos per cohort: [OR INVENT] - Survival definition: [E.G. STILL PAYING] </inputs> <task> Build the dashboard with: a header naming [SIGNUP MONTH]; a KPI row (newest cohort size, month-1 survival, latest aged survival, worst cohort); a survival curve overlaying the cohorts; a table of remaining logos and remaining % by month-n; a cohort picker; and a callout for the selected signup month. Survival is remaining paying logos / starting logos. Months a cohort has not reached yet are pending, not zero. Selecting a signup month bold the curve and restates the cards. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Cohort remaining-logo matrix in labeled JS constants at the top. - Print the survival definition on the page. - Pending cells labeled pending. Accessible contrast. - Do not convert logos to MRR on this screen. </constraints> <format> Return the full HTML as an artifact, then explain survival math and which matrix to replace. </format>

You are a SaaS cohort analyst who builds observed LTV from cumulative cohort revenue, not from a lifespan guess. <context> I need a cohort LTV build as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - Cohort window: [COHORT WINDOW] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Monthly revenue by cohort: [OR INVENT] - Starting logos per cohort: [OR INVENT] </inputs> <task> Build the dashboard with: a header naming [COHORT WINDOW]; a KPI row (newest cohort month-n LTV, month-12 LTV for aged cohorts, best cohort LTV, logos in that cohort); a line of cumulative revenue per starting logo by month-n; a table (cohort, starting logos, cumulative $, LTV at latest aged month); a month-n slider that restates LTV at that age for every cohort old enough; and a callout of month-12 LTV. LTV at month n is cumulative revenue through n / starting logos. Cohorts too young for that n show pending. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Monthly revenue and starting logos in labeled JS constants at the top. - Do not invent a lifespan or a gross-margin haircut unless I pasted them. Observed LTV only. - Slider updates cards and the callout. Accessible contrast. - Currency consistent; pending labeled. </constraints> <format> Return the full HTML as an artifact, then write the observed-LTV formula and which revenue matrix to replace. </format>

You are a SaaS cohort analyst who treats month-1, month-3, and month-12 revenue retention as three separate clocks. <context> I need a month 1, 3, and 12 revenue-retention dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. This is remaining MRR percent, not D1 D7 D30 product activity. </context> <inputs> - Ages to show: [RETENTION MONTHS] - Product name: [PRODUCT NAME] - Signup months of history: [E.G. LAST 18] - Targets per age: [E.G. M1 95%, M3 85%, M12 70%] </inputs> <task> Build the dashboard with: a header naming [RETENTION MONTHS]; a KPI card for each age versus its target; a triple line of the three rates over signup months; a table (signup month, beginning MRR, remaining at each age, rates); and a falling-window callout that names which clock dropped most versus the prior four aged cohorts. Compute each rate as remaining MRR at that age / beginning MRR, only for cohorts that have aged enough. Younger cohorts show pending, not zero. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - Signup-month rows in labeled JS constants at the top. - Pending cells labeled pending. Accessible contrast. - Do not invent activity or login rates. - Falling window is computed from the three series, not hardcoded. </constraints> <format> Return the full HTML as an artifact, then write the aged-enough rule and which array to replace. </format>

You are a SaaS cohort analyst who builds payback boards from cohort revenue versus the CAC of that signup month. <context> I need a cohort payback dashboard as one self-contained HTML file with inline CSS, vanilla JS, and a CDN chart library, seeded with realistic sample data so it opens as a working screen I can click in the chat. </context> <inputs> - CAC and starting logos by cohort: [CAC AND COHORT] - Product name: [PRODUCT NAME] - Currency: [E.G. USD] - Monthly revenue by cohort: [OR INVENT] - Payback target in months: [E.G. 12] - Gross margin to apply if you want contribution payback: [E.G. 80% OR 100% IF GROSS] </inputs> <task> Build the dashboard with: a header for [PRODUCT NAME]; a KPI row (cohorts paid back, median months to payback among aged cohorts, slowest cohort, share still unpaid); a bar of months-to-payback by cohort; a cumulative-revenue-versus-CAC line for the selected cohort; a sortable table (cohort, starting logos, CAC, cumulative contribution, months to payback or still open, status); and a slowest-cohort callout. Payback month is the first month where cumulative revenue times gross margin is at or above CAC. Cohorts that have not reached that point and are still inside the window show still open. Sorting by months to payback puts still-open rows last or first via a toggle. Clicking a cohort focuses the cumulative line. </task> <constraints> - One self-contained HTML file; one CDN charting library only. - CAC, logos, monthly revenue, target, and margin in labeled JS constants at the top. - Payback is computed, never hardcoded. Guard a zero CAC. - Over-target or still-open rows flagged with color and a text status. - Label margin as the sample rule I gave, not as a finance opinion. - Accessible contrast; currency consistent. </constraints> <format> Return the full HTML as an artifact, then write the payback rule and which CAC and revenue arrays to replace. </format>